|
<!DOCTYPE html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
<title>Letters to Abroad — Study in Germany, mentored by students already there</title>
|
|
<meta name="description" content="A student community helping international students get into German universities and careers. Peer-mentored. 500+ placements. 40+ partner universities. Free legal aid against agency scams.">
|
|
<link rel="preconnect" href="https://fonts.googleapis.com">
|
|
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
|
|
<link href="https://fonts.googleapis.com/css2?family=Instrument+Serif:ital@0;1&family=Inter+Tight:wght@300;400;500;600;700&family=JetBrains+Mono:wght@400;500&display=swap" rel="stylesheet">
|
|
<style>
|
|
:root{
|
|
/* LTA cream/off-white base — kept warm */
|
|
--cream:#F4EEDF;
|
|
--cream-2:#EDE3CD;
|
|
--cream-3:#E5D7BB;
|
|
--paper:#FAF5E8;
|
|
/* Ink — warm dark */
|
|
--ink:#1F1B2E;
|
|
--ink-2:#2C2640;
|
|
--ink-dim:#5C5575;
|
|
--ink-mute:#8B8499;
|
|
/* Dark inverse */
|
|
--dark:#15121F;
|
|
--dark-2:#1D1A2A;
|
|
--dark-3:#272338;
|
|
--dark-panel:rgba(244,238,223,0.04);
|
|
--dark-panel-hi:rgba(244,238,223,0.08);
|
|
--dark-line:rgba(244,238,223,0.1);
|
|
--dark-line-hi:rgba(244,238,223,0.18);
|
|
--dark-text:#F4EEDF;
|
|
--dark-dim:#A89FB8;
|
|
--dark-mute:#6E6680;
|
|
/* PRIMARY ACCENT — VIOLET (LTA brand) */
|
|
--violet:#7B5AE8;
|
|
--violet-hi:#9E83F0;
|
|
--violet-deep:#5B3DC8;
|
|
--violet-soft:#B7A2F2;
|
|
--violet-glow:rgba(123,90,232,0.35);
|
|
/* Secondary accents — kept warm for personality */
|
|
--terracotta:#D9573F;
|
|
--terracotta-hi:#E87555;
|
|
--mustard:#D4A748;
|
|
--mustard-hi:#E2B95E;
|
|
--olive:#8A8F4F;
|
|
--rose:#C88B7D;
|
|
/* Lines */
|
|
--line:rgba(31,27,46,0.1);
|
|
--line-hi:rgba(31,27,46,0.18);
|
|
/* Type */
|
|
--serif:'Instrument Serif', serif;
|
|
--sans:'Inter Tight', sans-serif;
|
|
--mono:'JetBrains Mono', monospace;
|
|
}
|
|
*{margin:0;padding:0;box-sizing:border-box;}
|
|
html{scroll-behavior:smooth;}
|
|
body{
|
|
font-family:var(--sans);
|
|
background:var(--cream);
|
|
color:var(--ink);
|
|
overflow-x:hidden;
|
|
-webkit-font-smoothing:antialiased;
|
|
}
|
|
a{color:inherit;text-decoration:none;}
|
|
button{font-family:inherit;border:none;background:none;cursor:pointer;color:inherit;}
|
|
|
|
/* ============== BOOT ============== */
|
|
.boot{
|
|
position:fixed;inset:0;z-index:10000;background:var(--cream);
|
|
display:flex;flex-direction:column;justify-content:center;align-items:center;
|
|
transition:opacity .9s .1s ease,visibility 0s 1.1s;
|
|
}
|
|
.boot.done{opacity:0;visibility:hidden;}
|
|
.boot-logo{
|
|
font-family:var(--serif);font-size:38px;font-style:italic;
|
|
letter-spacing:-.015em;margin-bottom:40px;opacity:0;color:var(--ink);
|
|
animation:bootF .7s .1s forwards;
|
|
}
|
|
.boot-logo em{color:var(--violet);font-style:italic;}
|
|
.boot-bar{width:220px;height:1px;background:var(--line);position:relative;overflow:hidden;}
|
|
.boot-bar::after{
|
|
content:'';position:absolute;top:0;left:0;height:100%;width:0;
|
|
background:linear-gradient(90deg,var(--violet),var(--mustard));
|
|
animation:bootB 1.1s .2s cubic-bezier(.6,.05,.3,1) forwards;
|
|
}
|
|
@keyframes bootF{to{opacity:1;}}
|
|
@keyframes bootB{to{width:100%;}}
|
|
|
|
/* ============== TEXTURE ============== */
|
|
body::before{
|
|
content:'';position:fixed;inset:0;pointer-events:none;z-index:100;
|
|
background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='200' height='200'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 0.15 0 0 0 0 0.12 0 0 0 0 0.2 0 0 0 0.07 0'/></filter><rect width='100%25' height='100%25' filter='url(%23n)'/></svg>");
|
|
opacity:.35;mix-blend-mode:multiply;
|
|
}
|
|
.nebula{position:fixed;inset:0;z-index:-2;pointer-events:none;overflow:hidden;}
|
|
.neb{position:absolute;border-radius:50%;filter:blur(120px);}
|
|
.neb-1{width:600px;height:600px;background:var(--violet);opacity:.08;top:-10%;left:-10%;animation:drift 40s infinite;}
|
|
.neb-2{width:500px;height:500px;background:var(--mustard);opacity:.07;bottom:20%;right:-5%;animation:drift 50s infinite reverse;}
|
|
@keyframes drift{0%,100%{transform:translate(0,0) scale(1);}50%{transform:translate(60px,-40px) scale(1.15);}}
|
|
|
|
/* ============== NAV ============== */
|
|
nav{
|
|
position:fixed;top:18px;left:50%;transform:translateX(-50%);
|
|
z-index:50;display:flex;align-items:center;gap:4px;
|
|
padding:7px 7px 7px 22px;
|
|
background:rgba(244,238,223,0.85);backdrop-filter:blur(24px) saturate(140%);
|
|
-webkit-backdrop-filter:blur(24px) saturate(140%);
|
|
border:1px solid var(--line);border-radius:100px;
|
|
box-shadow:0 4px 24px -8px rgba(31,27,46,0.08);
|
|
}
|
|
.logo{
|
|
font-family:var(--serif);font-size:19px;font-style:italic;
|
|
letter-spacing:-.01em;margin-right:24px;white-space:nowrap;color:var(--ink);
|
|
}
|
|
.logo em{color:var(--violet);font-style:italic;}
|
|
nav ul{display:flex;gap:2px;list-style:none;}
|
|
nav ul a{padding:8px 14px;border-radius:100px;font-size:13px;color:var(--ink-dim);transition:.25s;}
|
|
nav ul a:hover{color:var(--ink);background:rgba(31,27,46,0.04);}
|
|
.nav-cta{
|
|
padding:9px 18px;border-radius:100px;font-size:13px;font-weight:500;
|
|
background:var(--violet);color:var(--cream);transition:.3s;margin-left:12px;
|
|
position:relative;overflow:hidden;
|
|
}
|
|
.nav-cta::before{
|
|
content:'';position:absolute;inset:0;background:var(--violet-deep);
|
|
transform:translateX(-101%);transition:transform .35s cubic-bezier(.4,0,.2,1);
|
|
}
|
|
.nav-cta span{position:relative;z-index:1;}
|
|
.nav-cta:hover::before{transform:translateX(0);}
|
|
|
|
/* ============== BTN ============== */
|
|
.btn{
|
|
padding:15px 26px;border-radius:100px;font-size:14px;font-weight:500;
|
|
cursor:pointer;transition:color .3s,transform .3s,box-shadow .3s;
|
|
display:inline-flex;align-items:center;gap:10px;
|
|
border:1px solid transparent;font-family:var(--sans);
|
|
position:relative;overflow:hidden;
|
|
}
|
|
.btn > *{position:relative;z-index:1;}
|
|
.btn::before{
|
|
content:'';position:absolute;inset:0;
|
|
transition:transform .4s cubic-bezier(.4,0,.2,1);
|
|
transform:translateX(-101%);
|
|
}
|
|
.btn:hover::before{transform:translateX(0);}
|
|
.btn-primary{background:var(--violet);color:var(--cream);}
|
|
.btn-primary::before{background:var(--violet-deep);}
|
|
.btn-primary:hover{transform:translateY(-2px);box-shadow:0 14px 40px -10px var(--violet-glow);color:var(--cream);}
|
|
.btn-ghost{background:rgba(255,255,255,0.4);border-color:var(--line-hi);color:var(--ink);}
|
|
.btn-ghost::before{background:var(--ink);}
|
|
.btn-ghost:hover{color:var(--cream);border-color:var(--ink);}
|
|
.btn-dark{background:var(--ink);color:var(--cream);}
|
|
.btn-dark::before{background:var(--violet);}
|
|
.btn-dark:hover{color:var(--cream);}
|
|
.btn svg{width:14px;height:14px;}
|
|
.btn .arrow{transition:transform .3s;}
|
|
.btn:hover .arrow{transform:translateX(4px);}
|
|
|
|
/* ============== HERO with 3D ============== */
|
|
.hero{
|
|
min-height:96vh;display:flex;align-items:center;
|
|
padding:140px 40px 80px;position:relative;overflow:hidden;
|
|
}
|
|
#hero-3d{position:absolute;inset:0;z-index:0;pointer-events:none;}
|
|
.hero-container{
|
|
max-width:1320px;margin:0 auto;width:100%;
|
|
display:grid;grid-template-columns:1fr 1fr;gap:80px;align-items:center;
|
|
position:relative;z-index:2;
|
|
}
|
|
.hero-eyebrow{
|
|
display:inline-flex;align-items:center;gap:10px;
|
|
padding:6px 14px 6px 8px;border-radius:100px;
|
|
background:rgba(255,255,255,0.6);border:1px solid var(--line);
|
|
backdrop-filter:blur(8px);
|
|
font-family:var(--mono);font-size:11px;letter-spacing:.15em;
|
|
color:var(--ink-dim);text-transform:uppercase;margin-bottom:36px;
|
|
opacity:0;animation:fadeUp .8s .2s forwards;
|
|
}
|
|
.he-dot{width:6px;height:6px;border-radius:50%;background:var(--violet);box-shadow:0 0 8px var(--violet-glow);}
|
|
|
|
h1.hero-title{
|
|
font-family:var(--serif);font-weight:400;
|
|
font-size:clamp(44px,5.8vw,88px);line-height:1.02;letter-spacing:-.025em;
|
|
margin-bottom:28px;color:var(--ink);
|
|
}
|
|
.hero-title .line{display:block;overflow:hidden;padding:0 2px;}
|
|
.hero-title .line span{
|
|
display:inline-block;opacity:0;transform:translateY(100%);
|
|
animation:lineUp 1s cubic-bezier(.2,.8,.2,1) forwards;
|
|
}
|
|
.hero-title .line:nth-child(1) span{animation-delay:.3s;}
|
|
.hero-title .line:nth-child(2) span{animation-delay:.42s;}
|
|
.hero-title .line:nth-child(3) span{animation-delay:.54s;}
|
|
.italic{font-style:italic;color:var(--violet);}
|
|
.italic-mustard{font-style:italic;color:var(--mustard);}
|
|
|
|
.hero-sub{
|
|
font-size:18px;line-height:1.55;color:var(--ink-dim);
|
|
max-width:500px;margin-bottom:40px;
|
|
opacity:0;animation:fadeUp .8s .9s forwards;
|
|
}
|
|
.hero-cta{
|
|
display:flex;gap:12px;align-items:center;flex-wrap:wrap;margin-bottom:44px;
|
|
opacity:0;animation:fadeUp .8s 1.1s forwards;
|
|
}
|
|
.hero-proof{
|
|
display:flex;align-items:center;gap:20px;
|
|
opacity:0;animation:fadeUp .8s 1.3s forwards;
|
|
}
|
|
.hero-proof-avs{display:flex;}
|
|
.hero-proof-avs .av{
|
|
width:36px;height:36px;border-radius:50%;
|
|
background:linear-gradient(135deg,var(--violet),var(--mustard));
|
|
border:2px solid var(--cream);margin-left:-10px;
|
|
display:flex;align-items:center;justify-content:center;
|
|
font-family:var(--mono);font-size:11px;font-weight:500;color:var(--cream);
|
|
}
|
|
.hero-proof-avs .av:first-child{margin-left:0;}
|
|
.hero-proof-avs .av:nth-child(2){background:linear-gradient(135deg,var(--terracotta),var(--mustard));}
|
|
.hero-proof-avs .av:nth-child(3){background:linear-gradient(135deg,var(--violet-deep),var(--violet));}
|
|
.hero-proof-avs .av:nth-child(4){background:linear-gradient(135deg,var(--mustard),var(--rose));}
|
|
.hero-proof-text{font-size:13px;color:var(--ink-dim);line-height:1.45;}
|
|
.hero-proof-text strong{color:var(--ink);font-weight:500;}
|
|
|
|
/* Hero right — Zenna */
|
|
.hero-visual{
|
|
position:relative;aspect-ratio:1/1.05;
|
|
display:flex;align-items:center;justify-content:center;
|
|
opacity:0;animation:fadeIn 1.4s .6s forwards;
|
|
}
|
|
.hero-visual::before{
|
|
content:'';position:absolute;inset:10%;
|
|
background:radial-gradient(circle,var(--violet-glow),transparent 65%);
|
|
filter:blur(40px);z-index:0;
|
|
}
|
|
.hero-postmark{
|
|
position:absolute;top:-14px;right:-14px;z-index:5;
|
|
width:104px;height:104px;border:1.5px dashed var(--violet);
|
|
border-radius:50%;display:flex;align-items:center;justify-content:center;
|
|
transform:rotate(-12deg);background:var(--cream);
|
|
animation:stamp 12s linear infinite;
|
|
}
|
|
.hero-postmark-inner{
|
|
font-family:var(--serif);font-style:italic;font-size:12.5px;
|
|
color:var(--violet);text-align:center;line-height:1.2;letter-spacing:.02em;
|
|
}
|
|
.hero-postmark-inner strong{display:block;font-size:22px;font-weight:500;color:var(--ink);font-style:normal;margin:3px 0 1px;font-family:var(--serif);}
|
|
@keyframes stamp{0%{transform:rotate(-12deg);}50%{transform:rotate(-9deg);}100%{transform:rotate(-12deg);}}
|
|
|
|
.product-panel{
|
|
position:relative;width:100%;background:var(--paper);
|
|
border-radius:20px;border:1px solid var(--line-hi);
|
|
padding:24px;
|
|
box-shadow:0 40px 80px -20px rgba(31,27,46,0.18),0 0 60px var(--violet-glow);
|
|
transition:transform .7s cubic-bezier(.2,.8,.2,1);z-index:2;
|
|
}
|
|
.hero-visual:hover .product-panel{transform:rotateY(-3deg) rotateX(2deg) translateY(-4px);}
|
|
.pp-top{
|
|
display:flex;justify-content:space-between;align-items:center;
|
|
padding-bottom:16px;margin-bottom:18px;border-bottom:1px solid var(--line);
|
|
}
|
|
.pp-brand{display:flex;align-items:center;gap:10px;}
|
|
.pp-logo{
|
|
width:24px;height:24px;border-radius:6px;
|
|
background:linear-gradient(135deg,var(--violet),var(--mustard));
|
|
display:flex;align-items:center;justify-content:center;
|
|
font-family:var(--serif);font-style:italic;font-size:14px;color:var(--cream);font-weight:500;
|
|
}
|
|
.pp-title{font-family:var(--mono);font-size:10px;letter-spacing:.15em;color:var(--ink-dim);text-transform:uppercase;}
|
|
.pp-status{display:flex;align-items:center;gap:6px;font-family:var(--mono);font-size:10px;color:var(--violet-deep);}
|
|
.pp-status::before{content:'';width:5px;height:5px;border-radius:50%;background:var(--violet);box-shadow:0 0 6px var(--violet);animation:pulse 1.6s infinite;}
|
|
.pp-h{font-family:var(--serif);font-size:22px;font-weight:400;margin-bottom:4px;letter-spacing:-.015em;color:var(--ink);}
|
|
.pp-meta{font-family:var(--mono);font-size:10px;color:var(--ink-dim);letter-spacing:.08em;margin-bottom:20px;}
|
|
.pp-stages{display:flex;flex-direction:column;gap:8px;margin-bottom:18px;}
|
|
.pp-stage{
|
|
display:flex;align-items:center;gap:12px;padding:10px 12px;
|
|
background:rgba(31,27,46,0.02);border-radius:10px;border:1px solid var(--line);
|
|
}
|
|
.pp-stage.done{background:rgba(123,90,232,0.08);border-color:rgba(123,90,232,0.3);}
|
|
.pp-stage.now{background:rgba(212,167,72,0.12);border-color:rgba(212,167,72,0.35);}
|
|
.pp-check{
|
|
width:18px;height:18px;border-radius:50%;flex-shrink:0;
|
|
display:flex;align-items:center;justify-content:center;
|
|
background:rgba(31,27,46,0.04);border:1px solid var(--line-hi);
|
|
}
|
|
.pp-stage.done .pp-check{background:var(--violet);border-color:var(--violet);}
|
|
.pp-stage.done .pp-check svg{stroke:var(--cream);}
|
|
.pp-stage.now .pp-check{background:var(--mustard);border-color:var(--mustard);position:relative;}
|
|
.pp-stage.now .pp-check::after{
|
|
content:'';position:absolute;inset:-4px;border-radius:50%;
|
|
border:1px solid var(--mustard);animation:pulseRing 1.8s infinite;
|
|
}
|
|
.pp-check svg{width:10px;height:10px;fill:none;stroke-width:3;stroke:var(--cream);}
|
|
.pp-stage-label{flex:1;font-size:12.5px;color:var(--ink);}
|
|
.pp-stage-meta{font-family:var(--mono);font-size:10px;color:var(--ink-dim);}
|
|
.pp-bottom{display:grid;grid-template-columns:1fr 1fr;gap:10px;padding-top:16px;border-top:1px solid var(--line);}
|
|
.pp-stat{background:rgba(31,27,46,0.03);border-radius:8px;padding:10px 12px;}
|
|
.pp-stat-lbl{font-family:var(--mono);font-size:9px;color:var(--ink-mute);letter-spacing:.1em;text-transform:uppercase;margin-bottom:4px;}
|
|
.pp-stat-val{font-family:var(--serif);font-size:18px;font-style:italic;color:var(--violet);}
|
|
|
|
.hero-floaty{
|
|
position:absolute;background:var(--paper);
|
|
border:1px solid var(--line-hi);border-radius:14px;padding:12px 14px;
|
|
font-family:var(--mono);font-size:10px;letter-spacing:.1em;color:var(--ink-dim);
|
|
text-transform:uppercase;z-index:3;
|
|
box-shadow:0 14px 30px -8px rgba(31,27,46,0.12);
|
|
display:flex;align-items:center;gap:10px;
|
|
}
|
|
.hero-floaty .f-dot{width:5px;height:5px;border-radius:50%;background:var(--violet);}
|
|
.f-bottom{bottom:-4%;left:-6%;animation:floaty2 10s ease-in-out infinite;}
|
|
@keyframes floaty2{0%,100%{transform:translateY(0);}50%{transform:translateY(-8px);}}
|
|
|
|
@keyframes fadeUp{to{opacity:1;transform:translateY(0);}}
|
|
@keyframes fadeIn{to{opacity:1;}}
|
|
@keyframes lineUp{to{opacity:1;transform:translateY(0);}}
|
|
@keyframes pulse{0%,100%{opacity:1;}50%{opacity:.3;}}
|
|
@keyframes pulseRing{0%{transform:scale(1);opacity:.8;}100%{transform:scale(1.5);opacity:0;}}
|
|
|
|
/* ============== UNI + AWARDS ============== */
|
|
.trust-strip{padding:36px 40px 16px;border-top:1px solid var(--line);overflow:hidden;background:var(--cream-2);}
|
|
.trust-inner{max-width:1320px;margin:0 auto;}
|
|
.trust-label{font-family:var(--mono);font-size:11px;letter-spacing:.2em;color:var(--ink-mute);text-transform:uppercase;text-align:center;margin-bottom:24px;}
|
|
.trust-marquee{display:flex;gap:64px;animation:marquee 38s linear infinite;white-space:nowrap;align-items:center;}
|
|
.trust-uni{font-family:var(--serif);font-size:24px;font-style:italic;color:var(--ink-dim);display:flex;align-items:center;gap:14px;transition:color .3s;}
|
|
.trust-uni:hover{color:var(--ink);}
|
|
.trust-uni::after{content:'·';color:var(--ink-mute);margin-left:64px;}
|
|
@keyframes marquee{to{transform:translateX(-50%);}}
|
|
|
|
.awards-strip{padding:20px 40px 40px;background:var(--cream-2);border-bottom:1px solid var(--line);}
|
|
.awards-inner{max-width:1320px;margin:0 auto;display:flex;align-items:center;gap:40px;flex-wrap:wrap;justify-content:center;}
|
|
.award-label{font-family:var(--mono);font-size:11px;letter-spacing:.2em;color:var(--ink-mute);text-transform:uppercase;}
|
|
.award{
|
|
display:flex;align-items:center;gap:10px;padding:10px 18px;
|
|
background:var(--paper);border:1px solid var(--line);border-radius:100px;transition:.3s;
|
|
}
|
|
.award:hover{border-color:var(--line-hi);transform:translateY(-2px);box-shadow:0 8px 20px -8px rgba(31,27,46,0.12);}
|
|
.award-icon{width:18px;height:18px;color:var(--violet);flex-shrink:0;}
|
|
.award-icon svg{width:100%;height:100%;fill:currentColor;}
|
|
.award-text{font-size:12.5px;color:var(--ink);font-weight:500;line-height:1.2;}
|
|
.award-text em{display:block;font-family:var(--mono);font-size:9px;color:var(--ink-mute);font-style:normal;letter-spacing:.1em;text-transform:uppercase;margin-top:2px;}
|
|
|
|
/* ============== SECTION BASE ============== */
|
|
section{padding:140px 40px;position:relative;}
|
|
.container{max-width:1320px;margin:0 auto;}
|
|
.section-eyebrow{
|
|
display:inline-flex;align-items:center;gap:14px;margin-bottom:24px;
|
|
font-family:var(--mono);font-size:11px;letter-spacing:.2em;
|
|
color:var(--violet);text-transform:uppercase;
|
|
}
|
|
.section-eyebrow::before{content:'';width:28px;height:1px;background:var(--violet);}
|
|
.section-eyebrow.center{justify-content:center;width:100%;}
|
|
.section-eyebrow.center::after{content:'';width:28px;height:1px;background:var(--violet);}
|
|
h2.section-title{
|
|
font-family:var(--serif);font-weight:400;
|
|
font-size:clamp(40px,5vw,72px);line-height:1;letter-spacing:-.03em;
|
|
margin-bottom:28px;color:var(--ink);
|
|
}
|
|
h2.section-title em{font-style:italic;color:var(--violet);}
|
|
.section-intro{max-width:540px;font-size:17px;line-height:1.6;color:var(--ink-dim);}
|
|
|
|
/* ============== WHAT IS LTA ============== */
|
|
.what-section{
|
|
background:var(--dark);color:var(--dark-text);
|
|
padding:160px 40px;position:relative;
|
|
border-radius:40px 40px 0 0;margin-top:20px;overflow:hidden;
|
|
}
|
|
.what-section::before{
|
|
content:'';position:absolute;top:-30%;right:-10%;width:500px;height:500px;
|
|
background:radial-gradient(circle,var(--violet),transparent 60%);
|
|
opacity:.25;filter:blur(80px);pointer-events:none;
|
|
}
|
|
.what-section .section-eyebrow{color:var(--mustard);}
|
|
.what-section .section-eyebrow::before,.what-section .section-eyebrow::after{background:var(--mustard);}
|
|
.what-section h2.section-title{color:var(--dark-text);}
|
|
.what-section h2.section-title em{color:var(--violet-hi);}
|
|
.what-section .section-intro{color:var(--dark-dim);}
|
|
.what-header{text-align:center;margin-bottom:80px;max-width:760px;margin-left:auto;margin-right:auto;}
|
|
.what-header .section-eyebrow{justify-content:center;}
|
|
.what-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-bottom:70px;}
|
|
.what-card{
|
|
background:var(--dark-panel);border:1px solid var(--dark-line);
|
|
border-radius:20px;padding:32px 30px;transition:.4s;
|
|
display:flex;flex-direction:column;position:relative;overflow:hidden;
|
|
}
|
|
.what-card::after{
|
|
content:'';position:absolute;inset:0;border-radius:20px;
|
|
background:radial-gradient(circle at 50% 0,var(--violet-glow),transparent 60%);
|
|
opacity:0;transition:opacity .4s;pointer-events:none;
|
|
}
|
|
.what-card:hover{background:var(--dark-panel-hi);border-color:var(--dark-line-hi);transform:translateY(-4px);}
|
|
.what-card:hover::after{opacity:.3;}
|
|
.what-card > *{position:relative;z-index:1;}
|
|
.what-card-head{display:flex;align-items:center;gap:12px;margin-bottom:24px;}
|
|
.what-card-icon{
|
|
width:40px;height:40px;border-radius:10px;
|
|
background:var(--violet);color:var(--cream);
|
|
display:flex;align-items:center;justify-content:center;
|
|
}
|
|
.what-card-icon svg{width:18px;height:18px;stroke:currentColor;fill:none;stroke-width:1.5;}
|
|
.what-card-num{font-family:var(--mono);font-size:10px;letter-spacing:.18em;color:var(--dark-dim);text-transform:uppercase;}
|
|
.what-card h3{
|
|
font-family:var(--serif);font-size:26px;font-weight:400;letter-spacing:-.02em;
|
|
margin-bottom:14px;line-height:1.15;color:var(--dark-text);
|
|
}
|
|
.what-card p{font-size:14.5px;line-height:1.6;color:var(--dark-dim);}
|
|
.what-contrast{
|
|
background:var(--dark-panel);border-radius:20px;padding:48px 44px;
|
|
display:grid;grid-template-columns:1fr 1fr;gap:60px;align-items:center;
|
|
border:1px solid var(--dark-line);
|
|
}
|
|
.contrast-cols{display:grid;grid-template-columns:1fr 1fr;gap:32px;}
|
|
.contrast-col h4{font-family:var(--mono);font-size:11px;letter-spacing:.18em;text-transform:uppercase;margin-bottom:16px;}
|
|
.contrast-col.neg h4{color:var(--terracotta-hi);}
|
|
.contrast-col.pos h4{color:var(--violet-hi);}
|
|
.contrast-col ul{list-style:none;}
|
|
.contrast-col li{padding:10px 0;border-bottom:1px solid var(--dark-line);font-size:14px;color:var(--dark-dim);display:flex;align-items:start;gap:10px;}
|
|
.contrast-col li:last-child{border-bottom:none;}
|
|
.contrast-col.neg li::before{content:'×';color:var(--terracotta-hi);font-weight:500;flex-shrink:0;}
|
|
.contrast-col.pos li::before{content:'→';color:var(--violet-hi);flex-shrink:0;}
|
|
.contrast-col.pos li{color:var(--dark-text);}
|
|
.contrast-quote{
|
|
font-family:var(--serif);font-size:32px;font-style:italic;line-height:1.2;
|
|
color:var(--dark-text);letter-spacing:-.015em;
|
|
}
|
|
.contrast-quote em{color:var(--violet-hi);font-style:normal;background:rgba(123,90,232,0.18);padding:0 8px;border-radius:4px;}
|
|
|
|
/* ============== HOW IT WORKS ============== */
|
|
.steps-section{padding:160px 40px;background:var(--cream);}
|
|
.steps-header{display:grid;grid-template-columns:1.1fr 1fr;gap:80px;align-items:end;margin-bottom:80px;}
|
|
.steps-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;}
|
|
.step-card{
|
|
position:relative;padding:28px 24px;border-radius:18px;
|
|
background:var(--paper);border:1px solid var(--line);
|
|
transition:transform .6s cubic-bezier(.2,.8,.2,1),background .4s,border-color .4s,box-shadow .4s;
|
|
transform-style:preserve-3d;min-height:300px;display:flex;flex-direction:column;overflow:hidden;
|
|
}
|
|
.step-card::before{
|
|
content:'';position:absolute;inset:0;border-radius:18px;opacity:0;
|
|
background:radial-gradient(circle at var(--mx,50%) var(--my,50%),var(--violet-glow),transparent 55%);
|
|
transition:opacity .3s;pointer-events:none;z-index:0;
|
|
}
|
|
.step-card:hover{border-color:var(--line-hi);box-shadow:0 30px 60px -20px rgba(31,27,46,0.12);}
|
|
.step-card:hover::before{opacity:1;}
|
|
.step-card > *{position:relative;z-index:1;}
|
|
.step-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:24px;}
|
|
.step-tag{font-family:var(--mono);font-size:10px;letter-spacing:.15em;color:var(--ink-mute);text-transform:uppercase;}
|
|
.step-tag em{color:var(--violet);font-style:normal;}
|
|
.step-glyph{
|
|
width:34px;height:34px;border-radius:8px;
|
|
background:rgba(123,90,232,0.08);border:1px solid rgba(123,90,232,0.2);
|
|
display:flex;align-items:center;justify-content:center;
|
|
}
|
|
.step-glyph svg{width:16px;height:16px;stroke:var(--violet);fill:none;stroke-width:1.5;}
|
|
.step-num{font-family:var(--serif);font-style:italic;font-weight:400;font-size:56px;line-height:1;color:var(--violet);margin-bottom:14px;}
|
|
.step-card h3{font-family:var(--serif);font-weight:400;font-size:20px;letter-spacing:-.02em;margin-bottom:12px;line-height:1.2;color:var(--ink);}
|
|
.step-card p{font-size:13.5px;line-height:1.55;color:var(--ink-dim);flex:1;}
|
|
.step-time{margin-top:18px;padding-top:14px;border-top:1px solid var(--line);font-family:var(--mono);font-size:10px;color:var(--ink-mute);letter-spacing:.1em;text-transform:uppercase;}
|
|
.step-time em{color:var(--violet);font-style:normal;}
|
|
|
|
/* ============== SERVICES ============== */
|
|
.services-section{background:var(--cream-2);padding:180px 40px;}
|
|
.services-header{text-align:center;margin-bottom:60px;}
|
|
.services-header h2{margin:0 auto 24px;}
|
|
.services-header .section-intro{margin:0 auto;}
|
|
.services-tabs{display:flex;gap:8px;justify-content:center;margin-bottom:40px;flex-wrap:wrap;}
|
|
.services-tab{
|
|
padding:10px 18px;border-radius:100px;font-size:13px;
|
|
background:var(--paper);border:1px solid var(--line);color:var(--ink-dim);transition:.3s;
|
|
}
|
|
.services-tab:hover{border-color:var(--line-hi);color:var(--ink);}
|
|
.services-tab.active{background:var(--ink);color:var(--cream);border-color:var(--ink);}
|
|
.services-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;}
|
|
.svc{
|
|
background:var(--paper);border:1px solid var(--line);border-radius:16px;
|
|
padding:28px 24px;transition:.4s;position:relative;overflow:hidden;
|
|
display:flex;flex-direction:column;min-height:200px;
|
|
}
|
|
.svc:hover{border-color:var(--line-hi);transform:translateY(-3px);box-shadow:0 20px 40px -16px rgba(31,27,46,0.1);}
|
|
.svc-top{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:24px;}
|
|
.svc-code{font-family:var(--mono);font-size:10px;letter-spacing:.15em;color:var(--ink-mute);text-transform:uppercase;}
|
|
.svc-icon{
|
|
width:34px;height:34px;border-radius:8px;
|
|
background:rgba(123,90,232,0.1);border:1px solid rgba(123,90,232,0.25);
|
|
display:flex;align-items:center;justify-content:center;
|
|
}
|
|
.svc-icon svg{width:15px;height:15px;stroke:var(--violet);fill:none;stroke-width:1.5;}
|
|
.svc h4{font-family:var(--serif);font-size:21px;font-weight:400;letter-spacing:-.015em;margin-bottom:8px;color:var(--ink);}
|
|
.svc p{font-size:13px;color:var(--ink-dim);line-height:1.5;flex:1;}
|
|
.svc-price{margin-top:16px;padding-top:14px;border-top:1px solid var(--line);display:flex;justify-content:space-between;align-items:center;}
|
|
.svc-price-val{font-family:var(--mono);font-size:11px;color:var(--ink-dim);letter-spacing:.05em;}
|
|
.svc-price-val em{font-style:normal;font-family:var(--serif);font-size:16px;color:var(--violet);margin-right:4px;}
|
|
.svc-link{font-family:var(--mono);font-size:10px;color:var(--ink-mute);letter-spacing:.1em;text-transform:uppercase;transition:.3s;}
|
|
.svc:hover .svc-link{color:var(--violet);}
|
|
.svc.ai{border-color:rgba(212,167,72,0.4);background:linear-gradient(160deg,rgba(212,167,72,0.1),var(--paper) 60%);}
|
|
.svc.ai .svc-icon{background:var(--mustard);}
|
|
.svc.ai .svc-icon svg{stroke:var(--ink);}
|
|
.svc-ai-badge{font-family:var(--mono);font-size:9px;padding:3px 8px;border-radius:100px;background:var(--mustard);color:var(--ink);letter-spacing:.1em;text-transform:uppercase;}
|
|
|
|
/* ============== ZENNA PRODUCT ============== */
|
|
.product-section{padding:180px 40px;background:var(--cream);}
|
|
.product-hero{display:grid;grid-template-columns:1fr 1.2fr;gap:80px;align-items:center;margin-bottom:100px;}
|
|
.product-pill{
|
|
display:inline-flex;align-items:center;gap:10px;
|
|
padding:6px 14px 6px 8px;border-radius:100px;
|
|
background:var(--paper);border:1px solid var(--line);
|
|
font-family:var(--mono);font-size:11px;letter-spacing:.15em;color:var(--ink-dim);text-transform:uppercase;margin-bottom:28px;
|
|
}
|
|
.product-pill .pp-pill-tag{background:var(--violet);color:var(--cream);padding:3px 8px;border-radius:100px;font-weight:500;}
|
|
.product-features{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-bottom:40px;}
|
|
.pf{background:var(--paper);border:1px solid var(--line);border-radius:14px;padding:24px 22px;transition:.3s;}
|
|
.pf:hover{border-color:var(--line-hi);box-shadow:0 20px 40px -16px rgba(31,27,46,0.08);}
|
|
.pf-icon{
|
|
width:32px;height:32px;border-radius:8px;
|
|
background:rgba(123,90,232,0.1);border:1px solid rgba(123,90,232,0.25);
|
|
display:flex;align-items:center;justify-content:center;margin-bottom:16px;
|
|
}
|
|
.pf-icon svg{width:14px;height:14px;stroke:var(--violet);fill:none;stroke-width:1.6;}
|
|
.pf h4{font-family:var(--serif);font-size:18px;font-weight:400;margin-bottom:8px;letter-spacing:-.01em;color:var(--ink);}
|
|
.pf p{font-size:13px;color:var(--ink-dim);line-height:1.5;}
|
|
|
|
.product-visual{
|
|
position:relative;aspect-ratio:5/4;background:var(--dark);
|
|
border:1px solid var(--dark-line-hi);border-radius:20px;padding:24px;overflow:hidden;
|
|
box-shadow:0 40px 80px -20px rgba(31,27,46,0.25);
|
|
}
|
|
.product-visual::before{
|
|
content:'';position:absolute;inset:0;
|
|
background-image:linear-gradient(rgba(244,238,223,0.025) 1px,transparent 1px),linear-gradient(90deg,rgba(244,238,223,0.025) 1px,transparent 1px);
|
|
background-size:32px 32px;mask-image:radial-gradient(circle at center,black 40%,transparent 85%);
|
|
}
|
|
.pv-header{display:flex;justify-content:space-between;align-items:center;padding-bottom:14px;margin-bottom:18px;border-bottom:1px solid var(--dark-line);position:relative;z-index:2;}
|
|
.pv-tabs{display:flex;gap:6px;}
|
|
.pv-tab{padding:6px 12px;border-radius:6px;font-family:var(--mono);font-size:10px;color:var(--dark-dim);background:var(--dark-panel);letter-spacing:.08em;text-transform:uppercase;}
|
|
.pv-tab.on{background:var(--violet);color:var(--cream);}
|
|
.pv-stat{font-family:var(--mono);font-size:10px;color:var(--violet-hi);letter-spacing:.1em;}
|
|
.pv-grid{display:grid;grid-template-columns:1.2fr 1fr;gap:16px;position:relative;z-index:2;}
|
|
.pv-applications{background:var(--dark-panel);border:1px solid var(--dark-line);border-radius:12px;padding:14px;}
|
|
.pv-apps-title{font-family:var(--mono);font-size:10px;color:var(--dark-mute);letter-spacing:.1em;text-transform:uppercase;margin-bottom:12px;}
|
|
.pv-app{display:flex;align-items:center;gap:10px;padding:10px 0;border-bottom:1px solid var(--dark-line);}
|
|
.pv-app:last-child{border-bottom:none;}
|
|
.pv-app-dot{width:6px;height:6px;border-radius:50%;flex-shrink:0;}
|
|
.pv-app-dot.green{background:var(--violet-hi);box-shadow:0 0 6px var(--violet-hi);}
|
|
.pv-app-dot.amber{background:var(--mustard);box-shadow:0 0 6px var(--mustard);}
|
|
.pv-app-dot.gray{background:var(--dark-mute);}
|
|
.pv-app-name{font-size:12px;color:var(--dark-text);flex:1;}
|
|
.pv-app-pct{font-family:var(--mono);font-size:11px;color:var(--dark-dim);}
|
|
.pv-chart{background:var(--dark-panel);border:1px solid var(--dark-line);border-radius:12px;padding:14px;display:flex;flex-direction:column;}
|
|
.pv-chart-title{font-family:var(--mono);font-size:10px;color:var(--dark-mute);letter-spacing:.1em;text-transform:uppercase;margin-bottom:14px;}
|
|
.pv-bars{flex:1;display:flex;align-items:end;gap:6px;min-height:120px;}
|
|
.pv-bar{flex:1;background:linear-gradient(180deg,var(--violet),rgba(123,90,232,0.3));border-radius:3px 3px 0 0;animation:barGrow 1.4s cubic-bezier(.2,.8,.2,1) forwards;transform-origin:bottom;transform:scaleY(0);}
|
|
.pv-bar:nth-child(1){animation-delay:.1s;}.pv-bar:nth-child(2){animation-delay:.2s;}.pv-bar:nth-child(3){animation-delay:.3s;}.pv-bar:nth-child(4){animation-delay:.4s;}.pv-bar:nth-child(5){animation-delay:.5s;}.pv-bar:nth-child(6){animation-delay:.6s;}.pv-bar:nth-child(7){animation-delay:.7s;}
|
|
.pv-bar:nth-child(8){animation-delay:.8s;background:linear-gradient(180deg,var(--mustard),rgba(212,167,72,0.3));}
|
|
@keyframes barGrow{to{transform:scaleY(1);}}
|
|
.pv-chart-axis{font-family:var(--mono);font-size:9px;color:var(--dark-mute);letter-spacing:.1em;padding-top:8px;display:flex;justify-content:space-between;}
|
|
|
|
/* ============== ALPHA ============== */
|
|
.alpha-section{padding:180px 40px;background:var(--cream-2);}
|
|
.alpha-hero{display:grid;grid-template-columns:1fr 1fr;gap:80px;align-items:center;}
|
|
.alpha-board{
|
|
background:var(--dark);border:1px solid var(--dark-line-hi);border-radius:20px;padding:32px;
|
|
box-shadow:0 40px 80px -20px rgba(31,27,46,0.25);
|
|
transition:transform .7s cubic-bezier(.2,.8,.2,1);color:var(--dark-text);
|
|
}
|
|
.alpha-board:hover{transform:rotateY(4deg) rotateX(2deg);}
|
|
.ab-top{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px;padding-bottom:16px;border-bottom:1px solid var(--dark-line);}
|
|
.ab-title{display:flex;align-items:center;gap:10px;}
|
|
.ab-logo{width:28px;height:28px;border-radius:7px;background:linear-gradient(135deg,var(--violet),var(--mustard));display:flex;align-items:center;justify-content:center;font-family:var(--serif);font-style:italic;color:var(--cream);font-size:14px;font-weight:500;}
|
|
.ab-title-t{font-family:var(--mono);font-size:11px;letter-spacing:.15em;color:var(--dark-dim);text-transform:uppercase;}
|
|
.ab-status{font-family:var(--mono);font-size:10px;color:var(--violet-hi);}
|
|
.ab-h{font-family:var(--serif);font-size:22px;font-style:italic;margin-bottom:16px;color:var(--dark-text);}
|
|
.partners-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-bottom:22px;}
|
|
.partner-card{border:1px solid var(--dark-line);border-radius:10px;padding:14px 10px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;background:var(--dark-panel);transition:.3s;min-height:66px;}
|
|
.partner-card:hover{background:var(--dark-panel-hi);border-color:var(--dark-line-hi);}
|
|
.partner-card-name{font-family:var(--serif);font-size:15px;font-style:italic;color:var(--dark-text);}
|
|
.partner-card-meta{font-family:var(--mono);font-size:8px;letter-spacing:.1em;color:var(--dark-mute);text-transform:uppercase;}
|
|
.ab-metrics{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;padding-top:16px;border-top:1px solid var(--dark-line);}
|
|
.ab-metric{text-align:center;}
|
|
.ab-metric-val{font-family:var(--serif);font-size:26px;font-style:italic;color:var(--mustard);line-height:1;}
|
|
.ab-metric-lbl{font-family:var(--mono);font-size:9px;color:var(--dark-mute);letter-spacing:.1em;text-transform:uppercase;margin-top:6px;}
|
|
|
|
/* ============== TESTIMONIALS ============== */
|
|
.log-section{padding:160px 0;overflow:hidden;position:relative;background:var(--cream);}
|
|
|
|
/* ============== AWARDS SECTION ============== */
|
|
.awards-section{padding:160px 40px;background:var(--cream-2);position:relative;overflow:hidden;}
|
|
.awards-section::before{
|
|
content:'';position:absolute;top:-20%;right:-10%;width:500px;height:500px;
|
|
background:radial-gradient(circle,var(--violet-glow),transparent 70%);
|
|
filter:blur(80px);pointer-events:none;
|
|
}
|
|
.awards-section > .container{position:relative;z-index:1;}
|
|
.awards-header{text-align:center;margin-bottom:64px;max-width:680px;margin-left:auto;margin-right:auto;}
|
|
.awards-header h2{margin:0 auto 24px;}
|
|
.awards-header .section-intro{margin:0 auto;}
|
|
|
|
.awards-grid{display:grid;grid-template-columns:1.3fr 1fr;gap:20px;margin-bottom:48px;}
|
|
|
|
/* Featured big award */
|
|
.award-card-big{
|
|
position:relative;background:var(--paper);border:1px solid var(--line);
|
|
border-radius:24px;padding:48px 44px;overflow:hidden;
|
|
transition:.5s cubic-bezier(.2,.8,.2,1);
|
|
display:flex;flex-direction:column;
|
|
}
|
|
.award-card-big:hover{border-color:var(--line-hi);transform:translateY(-4px);box-shadow:0 40px 80px -24px rgba(31,27,46,0.18);}
|
|
.acb-bg-glow{
|
|
position:absolute;top:-30%;right:-30%;width:400px;height:400px;
|
|
background:radial-gradient(circle,var(--violet-glow),transparent 60%);
|
|
filter:blur(60px);opacity:.5;transition:opacity .5s;pointer-events:none;
|
|
}
|
|
.award-card-big:hover .acb-bg-glow{opacity:1;}
|
|
.award-card-big > *:not(.acb-bg-glow){position:relative;z-index:1;}
|
|
.acb-icon{
|
|
width:64px;height:64px;border-radius:16px;
|
|
background:linear-gradient(135deg,var(--violet),var(--violet-deep));
|
|
color:var(--cream);display:flex;align-items:center;justify-content:center;
|
|
margin-bottom:32px;box-shadow:0 16px 40px -12px var(--violet-glow);
|
|
}
|
|
.acb-icon svg{width:28px;height:28px;}
|
|
.acb-year{
|
|
font-family:var(--mono);font-size:11px;letter-spacing:.18em;
|
|
color:var(--violet);text-transform:uppercase;margin-bottom:12px;
|
|
}
|
|
.acb-title{
|
|
font-family:var(--serif);font-weight:400;font-size:42px;
|
|
line-height:1.05;letter-spacing:-.02em;margin-bottom:10px;color:var(--ink);
|
|
}
|
|
.acb-publisher{
|
|
font-family:var(--mono);font-size:12px;letter-spacing:.1em;
|
|
color:var(--ink-dim);text-transform:uppercase;margin-bottom:24px;
|
|
padding-bottom:24px;border-bottom:1px solid var(--line);
|
|
}
|
|
.acb-desc{font-size:15px;line-height:1.6;color:var(--ink);margin-bottom:32px;flex:1;}
|
|
.acb-link{
|
|
display:inline-flex;align-items:center;gap:8px;
|
|
font-family:var(--mono);font-size:11px;letter-spacing:.15em;
|
|
color:var(--violet);text-transform:uppercase;font-weight:500;transition:.3s;
|
|
}
|
|
.acb-link:hover{gap:14px;}
|
|
|
|
/* Smaller awards stack */
|
|
.awards-stack{display:flex;flex-direction:column;gap:14px;}
|
|
.award-card-sm{
|
|
background:var(--paper);border:1px solid var(--line);border-radius:16px;
|
|
padding:22px 24px;display:flex;align-items:center;gap:18px;
|
|
transition:.4s;flex:1;
|
|
}
|
|
.award-card-sm:hover{
|
|
border-color:var(--line-hi);transform:translateX(4px);
|
|
box-shadow:0 16px 32px -12px rgba(31,27,46,0.1);
|
|
}
|
|
.acs-icon{
|
|
width:42px;height:42px;border-radius:11px;flex-shrink:0;
|
|
background:rgba(123,90,232,0.1);border:1px solid rgba(123,90,232,0.25);
|
|
color:var(--violet);display:flex;align-items:center;justify-content:center;
|
|
transition:.3s;
|
|
}
|
|
.acs-icon svg{width:20px;height:20px;}
|
|
.award-card-sm:hover .acs-icon{background:var(--violet);color:var(--cream);border-color:var(--violet);}
|
|
.acs-body{flex:1;}
|
|
.acs-year{
|
|
font-family:var(--mono);font-size:9px;letter-spacing:.18em;
|
|
color:var(--ink-mute);text-transform:uppercase;margin-bottom:4px;
|
|
}
|
|
.acs-title{
|
|
font-family:var(--serif);font-size:18px;font-weight:400;
|
|
letter-spacing:-.01em;color:var(--ink);margin-bottom:3px;line-height:1.2;
|
|
}
|
|
.acs-publisher{font-size:12px;color:var(--ink-dim);}
|
|
|
|
/* Press marquee */
|
|
.press-strip{
|
|
padding:24px 0;background:var(--paper);border:1px solid var(--line);
|
|
border-radius:18px;overflow:hidden;display:flex;align-items:center;gap:24px;
|
|
padding-left:32px;
|
|
}
|
|
.ps-label{
|
|
font-family:var(--mono);font-size:11px;letter-spacing:.18em;
|
|
color:var(--ink-mute);text-transform:uppercase;flex-shrink:0;
|
|
}
|
|
.ps-marquee{
|
|
display:flex;gap:48px;animation:psScroll 28s linear infinite;
|
|
white-space:nowrap;flex:1;
|
|
}
|
|
.ps-item{
|
|
font-family:var(--serif);font-style:italic;font-size:22px;
|
|
color:var(--ink-dim);transition:color .3s;
|
|
}
|
|
.ps-item:hover{color:var(--violet);}
|
|
@keyframes psScroll{to{transform:translateX(-50%);}}
|
|
|
|
@media (max-width:1100px){
|
|
.awards-grid{grid-template-columns:1fr;}
|
|
.acb-title{font-size:32px;}
|
|
}
|
|
@media (max-width:680px){
|
|
.awards-section{padding:100px 20px;}
|
|
.award-card-big{padding:32px 24px;}
|
|
.acb-title{font-size:26px;}
|
|
.award-card-sm{padding:18px;}
|
|
.press-strip{flex-direction:column;align-items:flex-start;gap:14px;padding:20px;}
|
|
.ps-item{font-size:18px;}
|
|
}
|
|
.log-header{text-align:center;margin-bottom:60px;padding:0 40px;max-width:700px;margin-left:auto;margin-right:auto;}
|
|
.log-track{display:flex;gap:20px;animation:trackScroll 70s linear infinite;padding:0 12px;}
|
|
.log-entry{flex:0 0 380px;padding:30px;border-radius:20px;background:var(--paper);border:1px solid var(--line);transition:.4s;}
|
|
.log-entry:hover{transform:translateY(-5px);border-color:var(--line-hi);box-shadow:0 24px 48px -16px rgba(31,27,46,0.1);}
|
|
.log-top{display:flex;justify-content:space-between;align-items:center;padding-bottom:14px;margin-bottom:18px;border-bottom:1px solid var(--line);font-family:var(--mono);font-size:10px;letter-spacing:.12em;color:var(--ink-mute);text-transform:uppercase;}
|
|
.log-stars{color:var(--mustard);font-size:12px;letter-spacing:1px;}
|
|
.log-quote{font-family:var(--serif);font-size:19px;font-weight:400;line-height:1.4;color:var(--ink);margin-bottom:24px;font-style:italic;}
|
|
.log-person{display:flex;align-items:center;gap:12px;}
|
|
.log-avatar{width:40px;height:40px;border-radius:50%;background:linear-gradient(135deg,var(--violet),var(--mustard));display:flex;align-items:center;justify-content:center;font-family:var(--mono);font-size:11px;font-weight:500;color:var(--cream);letter-spacing:.05em;}
|
|
.log-avatar.a2{background:linear-gradient(135deg,var(--terracotta),var(--violet));}
|
|
.log-avatar.a3{background:linear-gradient(135deg,var(--mustard),var(--terracotta));}
|
|
.log-avatar.a4{background:linear-gradient(135deg,var(--violet-deep),var(--violet));}
|
|
.log-avatar.a5{background:linear-gradient(135deg,var(--violet-hi),var(--mustard));}
|
|
.log-avatar.a6{background:linear-gradient(135deg,var(--terracotta),var(--mustard));}
|
|
.log-name{font-size:13.5px;font-weight:500;margin-bottom:2px;color:var(--ink);}
|
|
.log-meta{font-family:var(--mono);font-size:10px;color:var(--ink-dim);letter-spacing:.08em;}
|
|
@keyframes trackScroll{to{transform:translateX(-50%);}}
|
|
|
|
/* ============== PACKAGES ============== */
|
|
.packages-section{padding:180px 40px;background:var(--cream-2);}
|
|
.pkg-header{text-align:center;margin-bottom:64px;max-width:700px;margin-left:auto;margin-right:auto;}
|
|
.pkg-header h2{margin:0 auto 24px;}
|
|
.pkg-header .section-intro{margin:0 auto;}
|
|
.packages-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;}
|
|
.pkg{background:var(--paper);border:1px solid var(--line);border-radius:22px;padding:36px 32px;transition:.5s;position:relative;display:flex;flex-direction:column;}
|
|
.pkg:hover{border-color:var(--line-hi);transform:translateY(-5px);box-shadow:0 30px 60px -20px rgba(31,27,46,0.12);}
|
|
.pkg.featured{background:var(--ink);color:var(--cream);border:1px solid var(--ink);box-shadow:0 30px 60px -20px var(--violet-glow);}
|
|
.pkg.featured h2,.pkg.featured .pkg-tier,.pkg.featured .pkg-name,.pkg.featured .pkg-sub,.pkg.featured .pkg-price-val{color:var(--cream);}
|
|
.pkg-badge{position:absolute;top:-11px;left:32px;padding:5px 12px;border-radius:100px;background:var(--violet);font-family:var(--mono);font-size:9px;letter-spacing:.15em;text-transform:uppercase;color:var(--cream);font-weight:500;}
|
|
.pkg-tier{font-family:var(--mono);font-size:10px;letter-spacing:.18em;color:var(--ink-dim);text-transform:uppercase;margin-bottom:12px;}
|
|
.pkg.featured .pkg-tier{color:var(--violet-hi);}
|
|
.pkg-name{font-family:var(--serif);font-size:32px;font-weight:400;letter-spacing:-.02em;margin-bottom:8px;color:var(--ink);}
|
|
.pkg-name em{font-style:italic;color:var(--violet);}
|
|
.pkg.featured .pkg-name em{color:var(--violet-hi);}
|
|
.pkg-sub{font-size:13.5px;color:var(--ink-dim);margin-bottom:20px;line-height:1.5;}
|
|
.pkg.featured .pkg-sub{color:var(--dark-dim);}
|
|
.pkg-price{display:flex;align-items:baseline;gap:6px;margin-bottom:24px;padding-bottom:24px;border-bottom:1px solid var(--line);}
|
|
.pkg.featured .pkg-price{border-color:var(--dark-line);}
|
|
.pkg-price-val{font-family:var(--serif);font-size:48px;font-style:italic;letter-spacing:-.02em;line-height:1;color:var(--ink);}
|
|
.pkg-price-note{font-family:var(--mono);font-size:11px;color:var(--ink-dim);letter-spacing:.05em;}
|
|
.pkg.featured .pkg-price-note{color:var(--dark-dim);}
|
|
.pkg-list{list-style:none;margin-bottom:28px;flex:1;}
|
|
.pkg-list li{padding:10px 0;font-size:13px;color:var(--ink);display:flex;align-items:start;gap:10px;}
|
|
.pkg.featured .pkg-list li{color:var(--cream);}
|
|
.pkg-list li svg{width:14px;height:14px;stroke:var(--violet);fill:none;stroke-width:2.2;flex-shrink:0;margin-top:3px;}
|
|
.pkg.featured .pkg-list li svg{stroke:var(--violet-hi);}
|
|
.pkg-list li.off{color:var(--ink-mute);}
|
|
.pkg-list li.off svg{stroke:var(--ink-mute);}
|
|
.pkg.featured .pkg-list li.off{color:var(--dark-mute);}
|
|
.pkg.featured .pkg-list li.off svg{stroke:var(--dark-mute);}
|
|
.pkg-fee-note{font-family:var(--mono);font-size:10px;color:var(--ink-mute);letter-spacing:.08em;text-transform:uppercase;margin-top:-16px;margin-bottom:18px;padding-bottom:18px;border-bottom:1px solid var(--line);}
|
|
.pkg.featured .pkg-fee-note{color:var(--dark-mute);border-color:var(--dark-line);}
|
|
.pkg-section-title{font-family:var(--mono);font-size:10px;color:var(--violet);letter-spacing:.15em;text-transform:uppercase;margin-bottom:6px;margin-top:6px;font-weight:500;}
|
|
.pkg.featured .pkg-section-title{color:var(--violet-hi);}
|
|
.pkg-cta{width:100%;padding:14px 20px;border-radius:100px;text-align:center;font-size:13.5px;font-weight:500;transition:.3s;font-family:var(--sans);display:block;position:relative;overflow:hidden;}
|
|
.pkg:not(.featured) .pkg-cta{background:transparent;border:1px solid var(--line-hi);color:var(--ink);}
|
|
.pkg:not(.featured) .pkg-cta:hover{background:var(--ink);color:var(--cream);border-color:var(--ink);}
|
|
.pkg.featured .pkg-cta{background:var(--violet);color:var(--cream);border:1px solid var(--violet);}
|
|
.pkg.featured .pkg-cta:hover{background:var(--violet-hi);border-color:var(--violet-hi);transform:translateY(-2px);}
|
|
|
|
/* Community free banner */
|
|
.pkg-free-banner{
|
|
background:var(--paper);border:1px solid var(--line);border-radius:22px;
|
|
padding:32px 40px;margin-bottom:24px;display:grid;
|
|
grid-template-columns:1.2fr 1.4fr auto;gap:48px;align-items:center;
|
|
position:relative;overflow:hidden;
|
|
}
|
|
.pkg-free-banner::before{
|
|
content:'';position:absolute;top:-50%;left:-10%;width:300px;height:300px;
|
|
background:radial-gradient(circle,var(--violet),transparent 70%);
|
|
opacity:.07;filter:blur(40px);pointer-events:none;
|
|
}
|
|
.pkg-free-banner > *{position:relative;z-index:1;}
|
|
.pfb-tag{font-family:var(--mono);font-size:10px;letter-spacing:.18em;color:var(--violet);text-transform:uppercase;margin-bottom:10px;}
|
|
.pfb-name{font-family:var(--serif);font-size:32px;font-weight:400;letter-spacing:-.02em;color:var(--ink);margin-bottom:6px;}
|
|
.pfb-name em{font-style:italic;color:var(--violet);}
|
|
.pfb-sub{font-size:13px;color:var(--ink-dim);line-height:1.55;}
|
|
.pfb-features{display:grid;grid-template-columns:1fr 1fr;gap:8px 18px;}
|
|
.pfb-feat{display:flex;align-items:center;gap:8px;font-size:12.5px;color:var(--ink);}
|
|
.pfb-feat svg{width:13px;height:13px;stroke:var(--violet);fill:none;stroke-width:2.2;flex-shrink:0;}
|
|
.pfb-right{display:flex;flex-direction:column;align-items:flex-end;gap:14px;}
|
|
.pfb-price{display:flex;align-items:baseline;gap:6px;}
|
|
.pfb-price-val{font-family:var(--serif);font-size:42px;font-style:italic;color:var(--violet);line-height:1;}
|
|
.pfb-price-note{font-family:var(--mono);font-size:11px;color:var(--ink-dim);letter-spacing:.05em;}
|
|
|
|
/* ============== TOOLS ============== */
|
|
.tools-section{padding:160px 40px;background:var(--cream);}
|
|
.tools-header{text-align:center;margin-bottom:60px;max-width:700px;margin-left:auto;margin-right:auto;}
|
|
.tools-header h2{margin:0 auto 24px;}
|
|
.tools-header .section-intro{margin:0 auto;}
|
|
.tools-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;}
|
|
.tool-card{background:var(--paper);border:1px solid var(--line);border-radius:18px;padding:28px 24px;transition:.4s;display:flex;flex-direction:column;min-height:240px;}
|
|
.tool-card:hover{border-color:var(--line-hi);transform:translateY(-4px);box-shadow:0 24px 48px -16px rgba(31,27,46,0.12);}
|
|
.tool-preview{aspect-ratio:2.2/1;border-radius:10px;background:var(--dark);border:1px solid var(--dark-line);margin-bottom:20px;display:flex;align-items:center;justify-content:center;position:relative;overflow:hidden;}
|
|
.tool-preview::before{content:'';position:absolute;inset:0;background-image:linear-gradient(0deg,transparent 0,transparent 3px,rgba(123,90,232,0.05) 4px,transparent 5px);background-size:100% 5px;}
|
|
.tool-value{font-family:var(--serif);font-size:38px;font-style:italic;color:var(--violet-hi);line-height:1;position:relative;z-index:1;text-shadow:0 0 16px var(--violet-glow);}
|
|
.tool-value small{font-family:var(--mono);font-size:11px;color:var(--dark-dim);margin-left:6px;font-style:normal;}
|
|
.tool-title{font-family:var(--serif);font-size:18px;font-weight:400;margin-bottom:8px;letter-spacing:-.01em;color:var(--ink);}
|
|
.tool-desc{font-size:12.5px;color:var(--ink-dim);line-height:1.5;flex:1;}
|
|
.tool-use{margin-top:16px;display:inline-flex;align-items:center;gap:8px;font-family:var(--mono);font-size:10px;color:var(--violet);letter-spacing:.1em;text-transform:uppercase;}
|
|
|
|
/* ============== CASE STUDIES ============== */
|
|
.case-section{padding:180px 40px;background:var(--cream-2);position:relative;}
|
|
.case-header{text-align:center;margin-bottom:80px;max-width:740px;margin-left:auto;margin-right:auto;}
|
|
.case-header h2{margin:0 auto 24px;}
|
|
.case-header .section-intro{margin:0 auto;}
|
|
.case-eyebrow-red{color:var(--terracotta) !important;}
|
|
.case-eyebrow-red::before,.case-eyebrow-red::after{background:var(--terracotta) !important;}
|
|
.case-grid{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin-bottom:32px;}
|
|
.case-card{background:var(--paper);border:1px solid var(--line);border-radius:22px;overflow:hidden;transition:.5s;display:flex;flex-direction:column;position:relative;}
|
|
.case-card:hover{border-color:var(--line-hi);box-shadow:0 40px 80px -24px rgba(31,27,46,0.15);transform:translateY(-4px);}
|
|
.case-card::before{content:'';position:absolute;top:0;left:0;right:0;height:3px;background:var(--terracotta);opacity:0;transition:opacity .3s;}
|
|
.case-card:hover::before{opacity:1;}
|
|
.case-top{padding:32px 32px 0;display:flex;justify-content:space-between;align-items:flex-start;gap:20px;}
|
|
.case-tag{display:inline-flex;align-items:center;gap:8px;padding:6px 12px;border-radius:100px;background:rgba(217,87,63,0.12);border:1px solid rgba(217,87,63,0.3);font-family:var(--mono);font-size:10px;letter-spacing:.15em;color:var(--terracotta);text-transform:uppercase;font-weight:500;}
|
|
.case-tag::before{content:'';width:6px;height:6px;border-radius:50%;background:var(--terracotta);animation:pulse 1.4s infinite;}
|
|
.case-meta{font-family:var(--mono);font-size:10px;letter-spacing:.12em;color:var(--ink-mute);text-transform:uppercase;text-align:right;}
|
|
.case-meta strong{color:var(--ink);font-weight:500;display:block;}
|
|
.case-body{padding:24px 32px 28px;flex:1;display:flex;flex-direction:column;}
|
|
.case-h{font-family:var(--serif);font-size:26px;font-weight:400;letter-spacing:-.02em;line-height:1.2;margin-bottom:20px;color:var(--ink);}
|
|
.case-h em{font-style:italic;color:var(--terracotta);}
|
|
.case-narrative{display:grid;grid-template-columns:auto 1fr;gap:14px 16px;margin-bottom:24px;padding:20px 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line);}
|
|
.case-narrative dt{font-family:var(--mono);font-size:10px;letter-spacing:.12em;color:var(--ink-mute);text-transform:uppercase;padding-top:2px;}
|
|
.case-narrative dd{font-size:13.5px;color:var(--ink);line-height:1.5;}
|
|
.case-narrative dd strong{color:var(--terracotta);font-weight:500;}
|
|
.case-quote{font-family:var(--serif);font-style:italic;font-size:17px;line-height:1.4;color:var(--ink);margin-bottom:24px;position:relative;padding-left:18px;border-left:2px solid var(--terracotta);}
|
|
.case-foot{display:flex;align-items:center;justify-content:space-between;padding-top:20px;border-top:1px solid var(--line);margin-top:auto;}
|
|
.case-student{display:flex;align-items:center;gap:12px;}
|
|
.case-avatar{width:36px;height:36px;border-radius:50%;background:linear-gradient(135deg,var(--ink-dim),var(--ink));display:flex;align-items:center;justify-content:center;font-family:var(--mono);font-size:11px;color:var(--cream);font-weight:500;letter-spacing:.05em;}
|
|
.case-student-info{font-size:12px;color:var(--ink-dim);line-height:1.3;}
|
|
.case-student-info strong{color:var(--ink);font-weight:500;display:block;font-size:13px;}
|
|
.case-read{font-family:var(--mono);font-size:10px;letter-spacing:.15em;color:var(--terracotta);text-transform:uppercase;font-weight:500;transition:.3s;display:inline-flex;align-items:center;gap:6px;}
|
|
.case-read:hover{gap:10px;}
|
|
.case-disclaimer{text-align:center;max-width:640px;margin:0 auto;font-family:var(--mono);font-size:10.5px;letter-spacing:.1em;color:var(--ink-mute);text-transform:uppercase;line-height:1.5;}
|
|
|
|
/* ============== LEGAL AID ============== */
|
|
.legal-section{padding:180px 40px;background:var(--cream);position:relative;}
|
|
.legal-hero{display:grid;grid-template-columns:1fr 1.1fr;gap:80px;align-items:center;}
|
|
.legal-badge{display:inline-flex;align-items:center;gap:10px;padding:7px 14px 7px 10px;border-radius:100px;background:var(--paper);border:1px solid var(--line);margin-bottom:24px;font-family:var(--mono);font-size:11px;letter-spacing:.15em;color:var(--ink-dim);text-transform:uppercase;}
|
|
.legal-badge-tag{background:var(--violet);color:var(--cream);padding:3px 8px;border-radius:100px;font-weight:500;}
|
|
.legal-h{font-family:var(--serif);font-weight:400;font-size:clamp(40px,5vw,72px);line-height:1;letter-spacing:-.03em;margin-bottom:28px;color:var(--ink);}
|
|
.legal-h em{font-style:italic;color:var(--violet);}
|
|
.legal-p{font-size:17px;line-height:1.6;color:var(--ink-dim);margin-bottom:32px;max-width:480px;}
|
|
.legal-features{display:flex;flex-direction:column;gap:16px;margin-bottom:36px;}
|
|
.legal-feat{display:flex;align-items:flex-start;gap:14px;padding:16px 20px;background:var(--paper);border:1px solid var(--line);border-radius:12px;transition:.3s;}
|
|
.legal-feat:hover{border-color:var(--line-hi);transform:translateX(4px);}
|
|
.legal-feat-icon{width:32px;height:32px;border-radius:8px;flex-shrink:0;background:rgba(123,90,232,0.12);border:1px solid rgba(123,90,232,0.3);display:flex;align-items:center;justify-content:center;}
|
|
.legal-feat-icon svg{width:14px;height:14px;stroke:var(--violet);fill:none;stroke-width:1.8;}
|
|
.legal-feat-text{flex:1;}
|
|
.legal-feat-text strong{font-family:var(--serif);font-size:17px;font-weight:400;color:var(--ink);display:block;margin-bottom:3px;letter-spacing:-.01em;}
|
|
.legal-feat-text span{font-size:13px;color:var(--ink-dim);line-height:1.5;}
|
|
|
|
.india-map{
|
|
position:relative;aspect-ratio:1/1.05;
|
|
background:var(--paper);border-radius:24px;padding:32px;
|
|
border:1px solid var(--line-hi);
|
|
box-shadow:0 40px 80px -24px rgba(31,27,46,0.15);
|
|
display:flex;flex-direction:column;
|
|
}
|
|
.map-header{display:flex;justify-content:space-between;align-items:center;padding-bottom:16px;border-bottom:1px solid var(--line);margin-bottom:20px;}
|
|
.map-title{display:flex;align-items:center;gap:10px;}
|
|
.map-title-icon{width:28px;height:28px;border-radius:7px;background:linear-gradient(135deg,var(--violet),var(--violet-deep));display:flex;align-items:center;justify-content:center;color:var(--cream);}
|
|
.map-title-icon svg{width:14px;height:14px;fill:currentColor;}
|
|
.map-title-t{font-family:var(--mono);font-size:11px;letter-spacing:.15em;color:var(--ink-dim);text-transform:uppercase;}
|
|
.map-live{display:flex;align-items:center;gap:6px;font-family:var(--mono);font-size:10px;color:var(--violet);letter-spacing:.1em;}
|
|
.map-live::before{content:'';width:6px;height:6px;border-radius:50%;background:var(--violet);animation:pulse 1.6s infinite;}
|
|
.map-svg-wrap{flex:1;position:relative;display:flex;align-items:center;justify-content:center;overflow:hidden;}
|
|
.map-svg{width:100%;height:100%;max-height:100%;}
|
|
.map-india-shape{fill:rgba(123,90,232,0.07);stroke:var(--violet);stroke-width:1;stroke-opacity:0.4;transition:fill .3s;}
|
|
.india-map:hover .map-india-shape{fill:rgba(123,90,232,0.12);}
|
|
.map-dot{fill:var(--violet);cursor:pointer;filter:drop-shadow(0 0 6px var(--violet-glow));}
|
|
.map-dot-pulse{fill:var(--violet);opacity:0.4;}
|
|
.map-city-label{font-family:var(--mono);font-size:9px;fill:var(--ink);letter-spacing:.05em;text-transform:uppercase;font-weight:500;}
|
|
.map-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;padding-top:18px;border-top:1px solid var(--line);}
|
|
.map-stat{text-align:center;}
|
|
.map-stat-val{font-family:var(--serif);font-size:26px;font-style:italic;color:var(--violet);line-height:1;}
|
|
.map-stat-lbl{font-family:var(--mono);font-size:9px;color:var(--ink-mute);letter-spacing:.1em;text-transform:uppercase;margin-top:6px;}
|
|
|
|
/* ============== EVENTS ============== */
|
|
.events-section{padding:160px 40px;background:var(--cream-2);}
|
|
.events-header{margin-bottom:60px;display:grid;grid-template-columns:1.2fr 1fr;gap:60px;align-items:end;}
|
|
.events-nav{display:flex;gap:8px;}
|
|
.ev-tag{padding:8px 14px;border-radius:100px;font-family:var(--mono);font-size:10px;background:var(--paper);border:1px solid var(--line);color:var(--ink-dim);letter-spacing:.1em;text-transform:uppercase;transition:.3s;}
|
|
.ev-tag:hover{border-color:var(--line-hi);color:var(--ink);}
|
|
.ev-tag.on{background:var(--violet);color:var(--cream);border-color:var(--violet);}
|
|
.events-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;}
|
|
.event-card{background:var(--paper);border:1px solid var(--line);border-radius:18px;overflow:hidden;transition:.4s;display:flex;flex-direction:column;}
|
|
.event-card:hover{border-color:var(--line-hi);transform:translateY(-4px);box-shadow:0 24px 48px -16px rgba(31,27,46,0.12);}
|
|
.event-img{aspect-ratio:16/10;position:relative;overflow:hidden;background:linear-gradient(135deg,rgba(123,90,232,0.4),rgba(212,167,72,0.2) 50%,rgba(217,87,63,0.3));}
|
|
.event-img::after{content:'';position:absolute;inset:0;background-image:radial-gradient(circle at 20% 30%,rgba(123,90,232,0.4) 0,transparent 40%),radial-gradient(circle at 80% 70%,rgba(212,167,72,0.4) 0,transparent 40%);}
|
|
.event-img-2{background:linear-gradient(135deg,rgba(212,167,72,0.4),rgba(123,90,232,0.3) 60%,rgba(217,87,63,0.3));}
|
|
.event-img-3{background:linear-gradient(135deg,rgba(217,87,63,0.4),rgba(123,90,232,0.3) 60%,rgba(212,167,72,0.3));}
|
|
.event-date{position:absolute;top:16px;left:16px;background:var(--cream);padding:8px 12px;border-radius:10px;border:1px solid var(--line);text-align:center;}
|
|
.event-date-day{font-family:var(--serif);font-size:22px;font-style:italic;color:var(--violet);line-height:1;}
|
|
.event-date-mo{font-family:var(--mono);font-size:9px;color:var(--ink);letter-spacing:.15em;text-transform:uppercase;margin-top:2px;}
|
|
.event-tag{position:absolute;top:16px;right:16px;background:var(--cream);padding:5px 10px;border-radius:100px;border:1px solid var(--line);font-family:var(--mono);font-size:9px;color:var(--violet);letter-spacing:.1em;text-transform:uppercase;}
|
|
.event-body{padding:22px;display:flex;flex-direction:column;flex:1;}
|
|
.event-city{font-family:var(--mono);font-size:10px;color:var(--ink-dim);letter-spacing:.15em;text-transform:uppercase;margin-bottom:10px;}
|
|
.event-h{font-family:var(--serif);font-size:19px;font-weight:400;margin-bottom:10px;letter-spacing:-.015em;line-height:1.2;color:var(--ink);}
|
|
.event-p{font-size:12.5px;color:var(--ink-dim);line-height:1.55;margin-bottom:16px;flex:1;}
|
|
.event-meta{display:flex;justify-content:space-between;padding-top:14px;border-top:1px solid var(--line);font-family:var(--mono);font-size:10px;color:var(--ink-mute);letter-spacing:.08em;text-transform:uppercase;}
|
|
.event-meta .rsvp{color:var(--violet);}
|
|
|
|
/* ============== TEAM (CARELOOP STYLE) ============== */
|
|
.team-section{padding:180px 40px;background:var(--cream);}
|
|
.team-header{text-align:center;margin-bottom:80px;max-width:760px;margin-left:auto;margin-right:auto;}
|
|
.team-header h2{margin:0 auto 24px;}
|
|
.team-header .section-intro{margin:0 auto;}
|
|
|
|
/* Founder spotlight */
|
|
.founder-block{
|
|
display:grid;grid-template-columns:1fr 1fr;gap:60px;align-items:center;
|
|
background:var(--paper);border:1px solid var(--line);border-radius:28px;
|
|
padding:48px;margin-bottom:80px;position:relative;overflow:hidden;
|
|
}
|
|
.founder-block::before{
|
|
content:'';position:absolute;top:-50%;right:-20%;width:500px;height:500px;
|
|
background:radial-gradient(circle,var(--violet-glow),transparent 70%);
|
|
filter:blur(60px);pointer-events:none;
|
|
}
|
|
.founder-block > *{position:relative;z-index:1;}
|
|
.founder-photo{
|
|
aspect-ratio:1/1;border-radius:24px;background:linear-gradient(135deg,var(--violet),var(--mustard));
|
|
display:flex;align-items:center;justify-content:center;position:relative;overflow:hidden;
|
|
font-family:var(--serif);font-size:140px;font-style:italic;color:var(--cream);
|
|
}
|
|
.founder-photo::before{content:'';position:absolute;inset:0;background:radial-gradient(circle at 30% 30%,rgba(255,255,255,0.25),transparent 60%);}
|
|
.founder-photo::after{
|
|
content:'';position:absolute;bottom:16px;right:16px;
|
|
width:60px;height:60px;border-radius:14px;background:var(--cream);
|
|
background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%237B5AE8'><path d='M19 3a2 2 0 0 1 2 2v14a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h14zM8.339 18.337v-8.59h-2.86v8.59h2.86zM6.91 8.575c.998 0 1.61-.66 1.61-1.487-.018-.846-.612-1.488-1.59-1.488-.978 0-1.617.642-1.617 1.488 0 .826.62 1.487 1.58 1.487h.018zm11.427 9.762h-.001V13.66c0-2.55-1.36-3.736-3.176-3.736-1.464 0-2.119.806-2.485 1.371V9.747h-2.857c.038.808 0 8.59 0 8.59h2.858v-4.797c0-.257.018-.514.094-.698.207-.514.677-1.046 1.467-1.046 1.035 0 1.45.788 1.45 1.945v4.596h2.858z'/></svg>");
|
|
background-size:30px;background-repeat:no-repeat;background-position:center;
|
|
border:1px solid var(--line);
|
|
}
|
|
.founder-info{padding-left:20px;}
|
|
.founder-tag{font-family:var(--mono);font-size:11px;color:var(--violet);letter-spacing:.18em;text-transform:uppercase;margin-bottom:18px;}
|
|
.founder-name{font-family:var(--serif);font-size:54px;font-weight:400;letter-spacing:-.025em;line-height:1.05;margin-bottom:8px;color:var(--ink);}
|
|
.founder-name em{font-style:italic;color:var(--violet);}
|
|
.founder-role{font-family:var(--mono);font-size:13px;color:var(--ink-dim);letter-spacing:.1em;text-transform:uppercase;margin-bottom:24px;}
|
|
.founder-bio{font-size:15px;line-height:1.6;color:var(--ink);margin-bottom:24px;}
|
|
.founder-quote{
|
|
font-family:var(--serif);font-style:italic;font-size:18px;line-height:1.4;
|
|
color:var(--ink-dim);padding-left:18px;border-left:2px solid var(--violet);margin-bottom:28px;
|
|
}
|
|
.founder-meta{display:flex;gap:24px;padding-top:24px;border-top:1px solid var(--line);}
|
|
.founder-meta-item{font-size:12px;color:var(--ink-dim);}
|
|
.founder-meta-item strong{display:block;font-family:var(--serif);font-size:18px;color:var(--ink);font-weight:500;font-style:italic;}
|
|
|
|
/* Team groups */
|
|
.team-group{margin-bottom:60px;}
|
|
.team-group-title{
|
|
font-family:var(--mono);font-size:11px;letter-spacing:.2em;text-transform:uppercase;
|
|
color:var(--ink-mute);margin-bottom:24px;display:flex;align-items:center;gap:14px;
|
|
}
|
|
.team-group-title::before{content:'';width:24px;height:1px;background:var(--ink-mute);}
|
|
.team-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;}
|
|
.team-card{background:var(--paper);border:1px solid var(--line);border-radius:18px;padding:24px;transition:.4s;text-align:center;}
|
|
.team-card:hover{border-color:var(--line-hi);transform:translateY(-4px);box-shadow:0 24px 48px -16px rgba(31,27,46,0.1);}
|
|
.team-photo{
|
|
width:100%;aspect-ratio:1/1;border-radius:14px;margin-bottom:18px;
|
|
background:linear-gradient(135deg,var(--violet),var(--mustard));
|
|
display:flex;align-items:center;justify-content:center;
|
|
font-family:var(--serif);font-size:54px;font-style:italic;color:var(--cream);
|
|
position:relative;overflow:hidden;
|
|
}
|
|
.team-photo::before{content:'';position:absolute;inset:0;background:radial-gradient(circle at 30% 30%,rgba(255,255,255,0.2),transparent 60%);}
|
|
.team-photo.p2{background:linear-gradient(135deg,var(--terracotta),var(--mustard));}
|
|
.team-photo.p3{background:linear-gradient(135deg,var(--violet-deep),var(--violet));}
|
|
.team-photo.p4{background:linear-gradient(135deg,var(--mustard),var(--rose));}
|
|
.team-photo.p5{background:linear-gradient(135deg,var(--violet),var(--violet-soft));}
|
|
.team-photo.p6{background:linear-gradient(135deg,var(--terracotta),var(--violet));}
|
|
.team-photo.p7{background:linear-gradient(135deg,var(--violet-hi),var(--mustard));}
|
|
.team-photo.p8{background:linear-gradient(135deg,var(--rose),var(--violet));}
|
|
.team-photo.p9{background:linear-gradient(135deg,var(--violet),var(--olive));}
|
|
.team-photo.p10{background:linear-gradient(135deg,var(--mustard),var(--violet));}
|
|
.team-name{font-family:var(--serif);font-size:20px;font-weight:400;margin-bottom:4px;letter-spacing:-.01em;color:var(--ink);}
|
|
.team-role{font-family:var(--mono);font-size:10px;color:var(--violet);letter-spacing:.1em;text-transform:uppercase;margin-bottom:10px;}
|
|
.team-uni{font-size:12px;color:var(--ink-dim);line-height:1.4;}
|
|
.team-cta{text-align:center;padding:32px;border:1px dashed var(--line-hi);border-radius:18px;background:var(--paper);margin-top:40px;}
|
|
|
|
/* Meet Our Team header */
|
|
.meet-team-header{text-align:center;margin:80px auto 50px;max-width:680px;}
|
|
.meet-team-header .section-eyebrow{justify-content:center;}
|
|
.meet-team-title{font-family:var(--serif);font-weight:400;font-size:clamp(32px,3.6vw,48px);line-height:1.05;letter-spacing:-.025em;color:var(--ink);margin-bottom:18px;}
|
|
.meet-team-title em{font-style:italic;color:var(--violet);}
|
|
.meet-team-intro{font-size:15.5px;color:var(--ink-dim);line-height:1.6;}
|
|
|
|
/* Team lead grid (4 dept heads) */
|
|
.team-grid-leads{display:grid;grid-template-columns:repeat(2,1fr);gap:20px;}
|
|
.team-lead-card{
|
|
background:var(--paper);border:1px solid var(--line);border-radius:22px;
|
|
padding:28px;display:grid;grid-template-columns:auto 1fr;gap:24px;align-items:center;
|
|
transition:.5s cubic-bezier(.2,.8,.2,1);position:relative;overflow:hidden;
|
|
}
|
|
.team-lead-card::before{
|
|
content:'';position:absolute;inset:0;border-radius:22px;
|
|
background:radial-gradient(circle at 0% 0%,var(--violet-glow),transparent 60%);
|
|
opacity:0;transition:opacity .4s;pointer-events:none;
|
|
}
|
|
.team-lead-card:hover{border-color:var(--line-hi);transform:translateY(-4px);box-shadow:0 30px 60px -20px rgba(31,27,46,0.15);}
|
|
.team-lead-card:hover::before{opacity:.5;}
|
|
.team-lead-card:hover .tlp-orb{animation-duration:6s;}
|
|
.team-lead-card:hover .tlp-initial{transform:scale(1.06);}
|
|
|
|
.team-lead-photo{
|
|
position:relative;width:120px;height:120px;border-radius:50%;
|
|
background:linear-gradient(135deg,var(--violet),var(--mustard));
|
|
display:flex;align-items:center;justify-content:center;flex-shrink:0;overflow:hidden;
|
|
box-shadow:0 14px 40px -12px var(--violet-glow);
|
|
}
|
|
.team-lead-photo.p3{background:linear-gradient(135deg,var(--violet-deep),var(--violet-hi));}
|
|
.team-lead-photo.p4{background:linear-gradient(135deg,var(--terracotta),var(--mustard));}
|
|
.team-lead-photo.p5{background:linear-gradient(135deg,var(--violet),var(--rose));}
|
|
.tlp-initial{
|
|
font-family:var(--serif);font-style:italic;font-weight:400;font-size:54px;
|
|
color:var(--cream);position:relative;z-index:2;
|
|
text-shadow:0 4px 16px rgba(0,0,0,0.15);
|
|
transition:transform .4s cubic-bezier(.2,.8,.2,1);
|
|
}
|
|
.tlp-orb{
|
|
position:absolute;border-radius:50%;
|
|
background:radial-gradient(circle,rgba(255,255,255,0.5),transparent 70%);
|
|
filter:blur(8px);animation:tlpFloat 9s ease-in-out infinite;
|
|
}
|
|
.tlp-o1{width:60px;height:60px;top:-10%;left:-10%;}
|
|
.tlp-o2{width:50px;height:50px;bottom:-15%;right:-15%;animation-delay:-3s;animation-direction:reverse;}
|
|
@keyframes tlpFloat{
|
|
0%,100%{transform:translate(0,0) scale(1);}
|
|
33%{transform:translate(15px,-10px) scale(1.15);}
|
|
66%{transform:translate(-10px,15px) scale(0.9);}
|
|
}
|
|
|
|
.team-lead-body{position:relative;z-index:1;}
|
|
.team-lead-name{font-family:var(--serif);font-size:22px;font-weight:400;letter-spacing:-.015em;color:var(--ink);margin-bottom:4px;}
|
|
.team-lead-role{font-family:var(--mono);font-size:11px;color:var(--violet);letter-spacing:.12em;text-transform:uppercase;margin-bottom:12px;}
|
|
.team-lead-desc{font-size:13px;color:var(--ink-dim);line-height:1.55;}
|
|
|
|
/* Founder photo upgraded */
|
|
.founder-photo .fp-initials{font-family:var(--serif);font-style:italic;font-size:140px;color:var(--cream);position:relative;z-index:2;text-shadow:0 6px 24px rgba(0,0,0,0.2);}
|
|
.founder-photo .fp-orbit{position:absolute;inset:0;width:100%;height:100%;animation:fpOrbitSpin 60s linear infinite;}
|
|
@keyframes fpOrbitSpin{to{transform:rotate(360deg);}}
|
|
.team-cta h4{font-family:var(--serif);font-size:24px;font-weight:400;margin-bottom:10px;letter-spacing:-.015em;color:var(--ink);}
|
|
.team-cta p{font-size:14px;color:var(--ink-dim);margin-bottom:20px;}
|
|
|
|
/* ============== PARTNERS ============== */
|
|
.partners-section{padding:180px 40px;background:var(--cream-2);}
|
|
.partners-header{text-align:center;margin-bottom:60px;max-width:700px;margin-left:auto;margin-right:auto;}
|
|
.partners-header h2{margin:0 auto 24px;}
|
|
.partners-header .section-intro{margin:0 auto;}
|
|
.partners-split{display:grid;grid-template-columns:1fr 1fr;gap:20px;}
|
|
.partners-block{background:var(--paper);border:1px solid var(--line);border-radius:22px;padding:48px 40px;transition:.4s;position:relative;overflow:hidden;}
|
|
.partners-block:hover{border-color:var(--line-hi);box-shadow:0 30px 60px -20px rgba(31,27,46,0.12);}
|
|
.partners-block::before{content:'';position:absolute;top:-50%;right:-20%;width:300px;height:300px;background:radial-gradient(circle,var(--violet),transparent 70%);opacity:.08;filter:blur(40px);}
|
|
.partners-block .p-tag{font-family:var(--mono);font-size:11px;color:var(--violet);letter-spacing:.2em;text-transform:uppercase;margin-bottom:18px;}
|
|
.partners-block h3{font-family:var(--serif);font-size:34px;font-weight:400;letter-spacing:-.02em;line-height:1.1;margin-bottom:20px;color:var(--ink);}
|
|
.partners-block h3 em{font-style:italic;color:var(--violet);}
|
|
.partners-block p{font-size:14px;color:var(--ink-dim);line-height:1.6;margin-bottom:28px;}
|
|
.partners-link{display:inline-flex;align-items:center;gap:10px;font-size:13px;color:var(--ink);font-weight:500;padding:12px 20px;border-radius:100px;background:var(--cream);border:1px solid var(--line-hi);transition:.3s;}
|
|
.partners-link:hover{background:var(--ink);color:var(--cream);border-color:var(--ink);gap:14px;}
|
|
|
|
/* Partner logos strip */
|
|
.partner-logos-strip{
|
|
display:flex;align-items:center;gap:40px;padding:24px 32px;
|
|
background:var(--paper);border:1px solid var(--line);border-radius:18px;
|
|
margin-bottom:32px;flex-wrap:wrap;justify-content:center;
|
|
}
|
|
.pls-label{font-family:var(--mono);font-size:11px;letter-spacing:.18em;color:var(--ink-mute);text-transform:uppercase;}
|
|
.pls-logos{display:flex;align-items:center;gap:36px;flex-wrap:wrap;justify-content:center;}
|
|
.pls-logo{
|
|
font-family:var(--serif);font-style:italic;font-size:22px;color:var(--ink-dim);
|
|
transition:color .3s,transform .3s;
|
|
}
|
|
.pls-logo:hover{color:var(--violet);transform:translateY(-2px);}
|
|
|
|
/* Partner blocks - upgraded design */
|
|
.partners-block{
|
|
position:relative;padding:56px 44px 44px;
|
|
}
|
|
.partners-block .pb-num{
|
|
position:absolute;top:32px;right:32px;
|
|
font-family:var(--serif);font-style:italic;font-size:64px;line-height:1;
|
|
color:var(--violet);opacity:.18;font-weight:400;
|
|
}
|
|
.partners-block .pb-icon{
|
|
width:56px;height:56px;border-radius:14px;
|
|
background:linear-gradient(135deg,var(--violet),var(--violet-deep));
|
|
color:var(--cream);display:flex;align-items:center;justify-content:center;
|
|
margin-bottom:28px;box-shadow:0 14px 30px -10px var(--violet-glow);
|
|
}
|
|
.partners-block .pb-icon svg{width:24px;height:24px;}
|
|
.pb-features{list-style:none;margin:24px 0 32px;padding-top:24px;border-top:1px solid var(--line);}
|
|
.pb-features li{
|
|
display:flex;align-items:center;gap:12px;padding:8px 0;
|
|
font-size:13.5px;color:var(--ink);
|
|
}
|
|
.pb-features li svg{width:14px;height:14px;flex-shrink:0;}
|
|
|
|
/* Dark variant for Companies card */
|
|
.partners-block-dark{
|
|
background:var(--ink);color:var(--cream);border-color:var(--ink);
|
|
box-shadow:0 30px 60px -20px rgba(31,27,46,0.3);
|
|
}
|
|
.partners-block-dark::before{background:radial-gradient(circle,var(--mustard),transparent 70%);opacity:.15;}
|
|
.partners-block-dark .pb-num{color:var(--mustard);opacity:.3;}
|
|
.partners-block-dark .pb-icon{background:linear-gradient(135deg,var(--mustard),var(--mustard-deep, #B08B30));color:var(--ink);box-shadow:0 14px 30px -10px rgba(212,167,72,0.5);}
|
|
.partners-block-dark .p-tag{color:var(--mustard);}
|
|
.partners-block-dark h3{color:var(--cream);}
|
|
.partners-block-dark h3 em{color:var(--mustard);}
|
|
.partners-block-dark p{color:var(--dark-dim);}
|
|
.partners-block-dark .pb-features{border-top-color:var(--dark-line);}
|
|
.partners-block-dark .pb-features li{color:var(--cream);}
|
|
.partners-link-light{
|
|
background:var(--dark-panel);border-color:var(--dark-line-hi);color:var(--cream);
|
|
}
|
|
.partners-link-light:hover{background:var(--mustard);color:var(--ink);border-color:var(--mustard);}
|
|
|
|
/* Partners callout */
|
|
.partners-callout{
|
|
margin-top:32px;padding:28px 36px;
|
|
background:var(--paper);border:1px dashed var(--line-hi);border-radius:18px;
|
|
display:grid;grid-template-columns:1fr auto;gap:32px;align-items:center;
|
|
}
|
|
.pc-eyebrow{font-family:var(--mono);font-size:10px;letter-spacing:.18em;color:var(--violet);text-transform:uppercase;margin-bottom:6px;}
|
|
.pc-text{font-size:14px;color:var(--ink);line-height:1.5;}
|
|
.pc-link{
|
|
display:inline-flex;align-items:center;gap:10px;
|
|
font-family:var(--mono);font-size:13px;color:var(--ink);
|
|
padding:12px 18px;background:var(--cream);border:1px solid var(--line-hi);
|
|
border-radius:100px;transition:.3s;white-space:nowrap;
|
|
}
|
|
.pc-link:hover{background:var(--violet);color:var(--cream);border-color:var(--violet);gap:14px;}
|
|
.pc-link svg{width:13px;height:13px;}
|
|
|
|
/* ============== LAUNCH ============== */
|
|
.launch-section{padding:200px 40px;position:relative;text-align:center;overflow:hidden;background:var(--dark);color:var(--dark-text);border-radius:40px 40px 0 0;margin-top:20px;}
|
|
.launch-section::before{content:'';position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:900px;height:900px;border-radius:50%;background:radial-gradient(circle,var(--violet-glow),transparent 60%);filter:blur(80px);z-index:-1;}
|
|
.launch-eyebrow{display:inline-flex;align-items:center;gap:12px;padding:7px 16px 7px 10px;border-radius:100px;background:var(--dark-panel);border:1px solid var(--dark-line);margin-bottom:32px;font-family:var(--mono);font-size:11px;letter-spacing:.18em;color:var(--dark-dim);text-transform:uppercase;}
|
|
.launch-eyebrow .dot{width:7px;height:7px;border-radius:50%;background:var(--violet);box-shadow:0 0 10px var(--violet);animation:pulse 1.4s infinite;}
|
|
.launch-title{font-family:var(--serif);font-weight:400;font-size:clamp(52px,7vw,120px);line-height:.98;letter-spacing:-.035em;margin-bottom:32px;}
|
|
.launch-title em{font-style:italic;background:linear-gradient(110deg,var(--violet),var(--mustard));-webkit-background-clip:text;background-clip:text;color:transparent;}
|
|
.launch-sub{font-size:18px;color:var(--dark-dim);max-width:540px;margin:0 auto 44px;line-height:1.6;}
|
|
.launch-form{max-width:520px;margin:0 auto;display:flex;gap:10px;flex-direction:column;align-items:stretch;}
|
|
.launch-input-row{display:flex;gap:10px;}
|
|
.launch-input{flex:1;padding:16px 20px;border-radius:100px;background:var(--dark-panel);border:1px solid var(--dark-line-hi);color:var(--dark-text);font-family:var(--sans);font-size:14px;transition:.3s;outline:none;}
|
|
.launch-input:focus{border-color:var(--violet);background:var(--dark-panel-hi);}
|
|
.launch-input::placeholder{color:var(--dark-mute);}
|
|
.launch-form .btn-primary{background:var(--violet);color:var(--cream);}
|
|
.launch-form .btn-primary::before{background:var(--violet-hi);}
|
|
.launch-form-note{font-family:var(--mono);font-size:10px;letter-spacing:.1em;color:var(--dark-mute);text-transform:uppercase;margin-top:12px;}
|
|
|
|
/* ============== FOOTER ============== */
|
|
footer{padding:80px 40px 32px;background:var(--dark-2);color:var(--dark-text);}
|
|
.footer-newsletter{max-width:1320px;margin:0 auto 48px;padding:32px 40px;background:var(--dark-panel);border:1px solid var(--dark-line);border-radius:18px;display:grid;grid-template-columns:1fr 1fr;gap:40px;align-items:center;}
|
|
.fn-left h5{font-family:var(--serif);font-size:22px;font-weight:400;margin-bottom:6px;letter-spacing:-.01em;color:var(--dark-text);}
|
|
.fn-left p{font-size:13px;color:var(--dark-dim);}
|
|
.fn-right{display:flex;gap:8px;}
|
|
.fn-input{flex:1;padding:12px 16px;border-radius:100px;background:var(--dark);border:1px solid var(--dark-line-hi);color:var(--dark-text);font-family:var(--sans);font-size:13px;outline:none;}
|
|
.fn-btn{padding:12px 22px;border-radius:100px;background:var(--violet);color:var(--cream);font-weight:500;font-size:13px;transition:.3s;}
|
|
.fn-btn:hover{background:var(--violet-hi);}
|
|
.footer-top{max-width:1320px;margin:0 auto 48px;display:grid;grid-template-columns:1.8fr 1fr 1fr 1fr 1fr;gap:40px;}
|
|
.footer-brand .logo{font-size:28px;margin:0 0 18px;display:block;color:var(--dark-text);}
|
|
.footer-brand .logo em{color:var(--violet);}
|
|
.footer-brand p{font-size:13.5px;color:var(--dark-dim);line-height:1.65;max-width:340px;margin-bottom:18px;}
|
|
.footer-coord{font-family:var(--mono);font-size:10px;color:var(--dark-mute);letter-spacing:.1em;text-transform:uppercase;margin-bottom:18px;}
|
|
.footer-social{display:flex;gap:8px;margin-top:4px;}
|
|
.footer-social a{width:34px;height:34px;border-radius:50%;border:1px solid var(--dark-line-hi);display:flex;align-items:center;justify-content:center;color:var(--dark-dim);transition:.3s;}
|
|
.footer-social a:hover{background:var(--violet);color:var(--cream);border-color:var(--violet);}
|
|
.footer-social a svg{width:13px;height:13px;fill:currentColor;}
|
|
.footer-col h4{font-family:var(--mono);font-size:10px;font-weight:500;letter-spacing:.2em;color:var(--dark-mute);text-transform:uppercase;margin-bottom:18px;}
|
|
.footer-col ul{list-style:none;}
|
|
.footer-col li{margin-bottom:11px;}
|
|
.footer-col a{font-size:13px;color:var(--dark-dim);transition:.25s;}
|
|
.footer-col a:hover{color:var(--violet-hi);}
|
|
.footer-bottom{max-width:1320px;margin:0 auto;padding-top:24px;border-top:1px solid var(--dark-line);display:flex;justify-content:space-between;font-size:11px;color:var(--dark-mute);font-family:var(--mono);letter-spacing:.1em;text-transform:uppercase;}
|
|
|
|
/* ============== REVEAL ============== */
|
|
.reveal{opacity:0;transform:translateY(40px);transition:opacity .9s cubic-bezier(.2,.8,.2,1),transform .9s cubic-bezier(.2,.8,.2,1);}
|
|
.reveal.in{opacity:1;transform:translateY(0);}
|
|
.rd1{transition-delay:.08s;}.rd2{transition-delay:.16s;}.rd3{transition-delay:.24s;}.rd4{transition-delay:.32s;}
|
|
|
|
/* ============== RESPONSIVE ============== */
|
|
@media (max-width:1100px){
|
|
.hero-container{grid-template-columns:1fr;gap:60px;}
|
|
.hero-visual{max-width:500px;margin:0 auto;}
|
|
.what-cards,.services-grid,.tools-grid,.events-grid,.packages-grid,.product-features,.case-grid{grid-template-columns:repeat(2,1fr);}
|
|
.case-grid{grid-template-columns:1fr;}
|
|
.team-grid{grid-template-columns:repeat(3,1fr);}
|
|
.steps-grid{grid-template-columns:repeat(2,1fr);}
|
|
.steps-header,.events-header{grid-template-columns:1fr;gap:30px;}
|
|
.product-hero,.alpha-hero,.partners-split,.legal-hero,.founder-block{grid-template-columns:1fr;gap:50px;}
|
|
.pkg-free-banner{grid-template-columns:1fr;gap:24px;text-align:left;}
|
|
.pfb-right{align-items:flex-start;}
|
|
.partners-callout{grid-template-columns:1fr;gap:16px;}
|
|
.team-grid-leads{grid-template-columns:1fr;}
|
|
.what-contrast{grid-template-columns:1fr;gap:40px;}
|
|
.footer-top{grid-template-columns:1fr 1fr;}
|
|
.footer-newsletter{grid-template-columns:1fr;gap:20px;}
|
|
.contrast-cols{grid-template-columns:1fr;gap:20px;}
|
|
.founder-info{padding-left:0;}
|
|
}
|
|
@media (max-width:680px){
|
|
section,.hero,.what-section,.team-section,.packages-section,.partners-section,.launch-section,.tools-section,.events-section,.services-section,.product-section,.alpha-section,.case-section,.legal-section{padding:100px 20px;}
|
|
nav{padding:6px 6px 6px 14px;}
|
|
nav ul{display:none;}
|
|
.logo{margin-right:8px;font-size:16px;}
|
|
.what-cards,.services-grid,.tools-grid,.events-grid,.packages-grid,.product-features,.steps-grid,.team-grid{grid-template-columns:1fr;}
|
|
.footer-top{grid-template-columns:1fr;gap:32px;}
|
|
.footer-bottom{flex-direction:column;gap:8px;align-items:center;}
|
|
.log-entry{flex:0 0 300px;padding:24px;}
|
|
.partners-block,.founder-block{padding:32px 24px;}
|
|
.launch-input-row{flex-direction:column;}
|
|
.hero-postmark{width:84px;height:84px;top:-8px;right:-8px;}
|
|
.hero-postmark-inner{font-size:10px;}
|
|
.hero-postmark-inner strong{font-size:17px;}
|
|
.case-top{padding:24px 24px 0;}
|
|
.case-body{padding:20px 24px 24px;}
|
|
.awards-inner{gap:16px;}
|
|
.founder-name{font-size:36px;}
|
|
.founder-photo{font-size:80px;}
|
|
.team-lead-card{grid-template-columns:1fr;text-align:center;justify-items:center;gap:18px;}
|
|
.team-lead-photo{width:96px;height:96px;}
|
|
.tlp-initial{font-size:42px;}
|
|
.partners-block{padding:40px 24px 32px;}
|
|
.partners-block .pb-num{font-size:42px;top:24px;right:24px;}
|
|
.partner-logos-strip{gap:20px;padding:20px 24px;}
|
|
.pls-logos{gap:24px;}
|
|
.pls-logo{font-size:18px;}
|
|
.meet-team-title{font-size:30px;}
|
|
}
|
|
</style>
|
|
</head>
|
|
<body>
|
|
|
|
<!-- BOOT -->
|
|
<div class="boot" id="boot">
|
|
<div class="boot-logo">Letters<em> · </em>to<em> · </em>Abroad</div>
|
|
<div class="boot-bar"></div>
|
|
</div>
|
|
|
|
<div class="nebula">
|
|
<div class="neb neb-1"></div>
|
|
<div class="neb neb-2"></div>
|
|
</div>
|
|
|
|
<nav>
|
|
<span class="logo">Letters<em>·</em>to<em>·</em>Abroad</span>
|
|
<ul>
|
|
<li><a href="#what">What is LTA</a></li>
|
|
<li><a href="#how">How it works</a></li>
|
|
<li><a href="#services">Services</a></li>
|
|
<li><a href="#cases">Case studies</a></li>
|
|
<li><a href="#legal">Legal aid</a></li>
|
|
<li><a href="#team">Team</a></li>
|
|
</ul>
|
|
<a href="#start" class="nav-cta"><span>Free evaluation</span></a>
|
|
</nav>
|
|
|
|
<!-- HERO -->
|
|
<section class="hero" id="home">
|
|
<canvas id="hero-3d"></canvas>
|
|
<div class="hero-container">
|
|
<div class="hero-left">
|
|
<div class="hero-eyebrow">
|
|
<span class="he-dot"></span>
|
|
<span>Student community · Est. Regensburg, DE · 2021</span>
|
|
</div>
|
|
<h1 class="hero-title">
|
|
<span class="line"><span>Study in Germany,</span></span>
|
|
<span class="line"><span>mentored by students</span></span>
|
|
<span class="line"><span><em>already there.</em></span></span>
|
|
</h1>
|
|
<p class="hero-sub">We help international students get into German universities — and into their first jobs after. Not an agency. Not a consultancy. A peer-powered community of students who made it, helping the ones still applying.</p>
|
|
<div class="hero-cta">
|
|
<a href="#start" class="btn btn-primary">
|
|
<span>Free profile evaluation</span>
|
|
<svg class="arrow" viewBox="0 0 16 16" fill="none"><path d="M1 8h14M9 2l6 6-6 6" stroke="currentColor" stroke-width="1.5"/></svg>
|
|
</a>
|
|
<a href="#how" class="btn btn-ghost"><span>How it works</span></a>
|
|
</div>
|
|
<div class="hero-proof">
|
|
<div class="hero-proof-avs">
|
|
<div class="av">SJ</div><div class="av">GT</div><div class="av">FS</div><div class="av">RP</div>
|
|
</div>
|
|
<div class="hero-proof-text">
|
|
<strong>500+ students</strong> placed across 40+ universities.<br>
|
|
Last admit: <strong>Anirudh → TU Dresden</strong>, Winter '26.
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="hero-visual">
|
|
<div class="hero-postmark">
|
|
<div class="hero-postmark-inner">Since<strong>2021</strong>Regensburg</div>
|
|
</div>
|
|
<div class="product-panel">
|
|
<div class="pp-top">
|
|
<div class="pp-brand">
|
|
<div class="pp-logo">Z</div>
|
|
<div class="pp-title">Zenna · Application tracker</div>
|
|
</div>
|
|
<div class="pp-status">Live</div>
|
|
</div>
|
|
<div class="pp-h">Rithika M · Winter 2026</div>
|
|
<div class="pp-meta">TU MÜNCHEN · M.SC. COMPUTATIONAL SCIENCE</div>
|
|
<div class="pp-stages">
|
|
<div class="pp-stage done"><div class="pp-check"><svg viewBox="0 0 16 16"><path d="M3 8l4 4 6-8"/></svg></div><div class="pp-stage-label">Documents verified</div><div class="pp-stage-meta">2 Apr</div></div>
|
|
<div class="pp-stage done"><div class="pp-check"><svg viewBox="0 0 16 16"><path d="M3 8l4 4 6-8"/></svg></div><div class="pp-stage-label">APS certificate issued</div><div class="pp-stage-meta">9 Apr</div></div>
|
|
<div class="pp-stage now"><div class="pp-check"></div><div class="pp-stage-label">SOP under mentor review</div><div class="pp-stage-meta">Now</div></div>
|
|
<div class="pp-stage"><div class="pp-check"></div><div class="pp-stage-label">Submit via uni-assist</div><div class="pp-stage-meta">Pending</div></div>
|
|
</div>
|
|
<div class="pp-bottom">
|
|
<div class="pp-stat"><div class="pp-stat-lbl">Progress</div><div class="pp-stat-val">72%</div></div>
|
|
<div class="pp-stat"><div class="pp-stat-lbl">Days left</div><div class="pp-stat-val">14</div></div>
|
|
</div>
|
|
</div>
|
|
<div class="hero-floaty f-bottom">
|
|
<span class="f-dot"></span>
|
|
<span>Mentor · Varsha K. · online</span>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
<!-- UNI TRUST + AWARDS -->
|
|
<div class="trust-strip">
|
|
<div class="trust-inner">
|
|
<div class="trust-label">Students we've helped admit to</div>
|
|
<div class="trust-marquee">
|
|
<span class="trust-uni">Technische Universität München</span>
|
|
<span class="trust-uni">RWTH Aachen</span>
|
|
<span class="trust-uni">FU Berlin</span>
|
|
<span class="trust-uni">TU Dresden</span>
|
|
<span class="trust-uni">Uni Duisburg-Essen</span>
|
|
<span class="trust-uni">TU Clausthal</span>
|
|
<span class="trust-uni">Uni Paderborn</span>
|
|
<span class="trust-uni">Uni Stuttgart</span>
|
|
<span class="trust-uni">OVGU Magdeburg</span>
|
|
<span class="trust-uni">TU Braunschweig</span>
|
|
<span class="trust-uni">Technische Universität München</span>
|
|
<span class="trust-uni">RWTH Aachen</span>
|
|
<span class="trust-uni">FU Berlin</span>
|
|
<span class="trust-uni">TU Dresden</span>
|
|
<span class="trust-uni">Uni Duisburg-Essen</span>
|
|
<span class="trust-uni">TU Clausthal</span>
|
|
<span class="trust-uni">Uni Paderborn</span>
|
|
<span class="trust-uni">Uni Stuttgart</span>
|
|
<span class="trust-uni">OVGU Magdeburg</span>
|
|
<span class="trust-uni">TU Braunschweig</span>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="awards-strip">
|
|
<div class="awards-inner">
|
|
<div class="award-label">Recognised by</div>
|
|
<div class="award">
|
|
<div class="award-icon"><svg viewBox="0 0 24 24"><path d="M12 15a7 7 0 1 0 0-14 7 7 0 0 0 0 14zm0-2a5 5 0 1 1 0-10 5 5 0 0 1 0 10zm-4.9 1.6L5 22l7-3 7 3-2.1-7.4"/></svg></div>
|
|
<div class="award-text">Top 20 Student Communities<em>YourStory · 2024</em></div>
|
|
</div>
|
|
<div class="award">
|
|
<div class="award-icon"><svg viewBox="0 0 24 24"><path d="M12 2l3 7h7l-5.5 4.5L18 21l-6-4-6 4 1.5-7.5L2 9h7z"/></svg></div>
|
|
<div class="award-text">EdTech Innovation Award<em>NASSCOM · 2024</em></div>
|
|
</div>
|
|
<div class="award">
|
|
<div class="award-icon"><svg viewBox="0 0 24 24"><path d="M5 3h14v4a7 7 0 0 1-14 0V3zm7 11v7m-4 0h8M3 5h2v2H3zm16 0h2v2h-2z"/></svg></div>
|
|
<div class="award-text">Featured in The Hindu<em>Education feature · 2023</em></div>
|
|
</div>
|
|
<div class="award">
|
|
<div class="award-icon"><svg viewBox="0 0 24 24"><path d="M3 3h18v18H3V3zm5 5h8v8H8V8z"/></svg></div>
|
|
<div class="award-text">DAAD India partner<em>Community support · 2024</em></div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- WHAT IS LTA -->
|
|
<section class="what-section" id="what">
|
|
<div class="container">
|
|
<div class="what-header reveal">
|
|
<div class="section-eyebrow center">What Letters to Abroad is</div>
|
|
<h2 class="section-title">A student community. <em>Not a consultancy.</em></h2>
|
|
<p class="section-intro">We built LTA because when we applied, we got burned by agents selling false promises. Now we're the community we wish we'd had — transparent, peer-led, built by students already studying in Germany.</p>
|
|
</div>
|
|
|
|
<div class="what-cards">
|
|
<div class="what-card reveal rd1">
|
|
<div class="what-card-head">
|
|
<div class="what-card-icon"><svg viewBox="0 0 24 24"><path d="M17 20h5v-2a3 3 0 0 0-5.356-1.857M17 20H7m10 0v-2c0-.656-.126-1.283-.356-1.857M7 20H2v-2a3 3 0 0 1 5.356-1.857M7 20v-2c0-.656.126-1.283.356-1.857M15 7a3 3 0 1 1-6 0 3 3 0 0 1 6 0z"/></svg></div>
|
|
<div class="what-card-num">01 · Peer-mentored</div>
|
|
</div>
|
|
<h3>Mentored by students, not salespeople.</h3>
|
|
<p>Every mentor is a current student at a German university — someone who sat where you're sitting less than two years ago. No commissions, no affiliate deals, no sales pressure.</p>
|
|
</div>
|
|
<div class="what-card reveal rd2">
|
|
<div class="what-card-head">
|
|
<div class="what-card-icon"><svg viewBox="0 0 24 24"><path d="M9 12l2 2 4-4m6 2a9 9 0 1 1-18 0 9 9 0 0 1 18 0z"/></svg></div>
|
|
<div class="what-card-num">02 · Transparent</div>
|
|
</div>
|
|
<h3>Every step, visible to you.</h3>
|
|
<p>Zenna — our application tracker — shows you live status on every document, every deadline, every decision. No black-box "we're working on it." You see exactly what's happening, when.</p>
|
|
</div>
|
|
<div class="what-card reveal rd3">
|
|
<div class="what-card-head">
|
|
<div class="what-card-icon"><svg viewBox="0 0 24 24"><path d="M12 14l9-5-9-5-9 5 9 5zm0 0l6.16-3.422a12.083 12.083 0 0 1 .665 6.479A11.952 11.952 0 0 0 12 20.055a11.952 11.952 0 0 0-6.824-2.998 12.078 12.078 0 0 1 .665-6.479L12 14z"/></svg></div>
|
|
<div class="what-card-num">03 · End-to-end</div>
|
|
</div>
|
|
<h3>From application to first paycheque.</h3>
|
|
<p>Getting in is half the journey. We also help you find accommodation, set up your blocked account, clear your visa interview, and — via ALPHA Bootcamp — land your first job in Germany.</p>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="what-contrast reveal">
|
|
<div class="contrast-cols">
|
|
<div class="contrast-col neg">
|
|
<h4>What agencies do</h4>
|
|
<ul>
|
|
<li>Promise admits they can't guarantee</li>
|
|
<li>Sell copy-paste SOPs</li>
|
|
<li>Hide the process behind a salesperson</li>
|
|
<li>Take commissions from universities</li>
|
|
<li>Disappear after the visa stamp</li>
|
|
</ul>
|
|
</div>
|
|
<div class="contrast-col pos">
|
|
<h4>What LTA does</h4>
|
|
<ul>
|
|
<li>Match you with students from your target programme</li>
|
|
<li>Draft SOPs with you, reviewed by your mentor</li>
|
|
<li>Show you every step in Zenna, live</li>
|
|
<li>Zero university commissions. Ever.</li>
|
|
<li>Walk with you through ALPHA, post-arrival</li>
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
<p class="contrast-quote">"We're not in the <em>business</em> of getting you to Germany. We're in the community of people already there, helping you join us."</p>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
<!-- HOW IT WORKS -->
|
|
<section class="steps-section" id="how">
|
|
<div class="container">
|
|
<div class="steps-header reveal">
|
|
<div>
|
|
<div class="section-eyebrow">How it works</div>
|
|
<h2 class="section-title">Four steps. <em>One semester.</em></h2>
|
|
</div>
|
|
<p class="section-intro">Every journey with LTA follows a clear sequence. You always know where you are, what's next, and who's helping you with it.</p>
|
|
</div>
|
|
<div class="steps-grid">
|
|
<div class="step-card reveal rd1">
|
|
<div class="step-head"><div class="step-tag">Step <em>01</em></div><div class="step-glyph"><svg viewBox="0 0 24 24"><path d="M9 12l2 2 4-4m6 2a9 9 0 1 1-18 0 9 9 0 0 1 18 0z"/></svg></div></div>
|
|
<div class="step-num">01</div>
|
|
<h3>Sign up & get verified</h3>
|
|
<p>Quick profile setup. We verify your academic background so your mentor can match you to the right programmes — no guesswork.</p>
|
|
<div class="step-time">Week 1 · <em>Ready in 24 hrs</em></div>
|
|
</div>
|
|
<div class="step-card reveal rd2">
|
|
<div class="step-head"><div class="step-tag">Step <em>02</em></div><div class="step-glyph"><svg viewBox="0 0 24 24"><path d="M17 20h5v-2a3 3 0 0 0-5.356-1.857M17 20H7m10 0v-2c0-.656-.126-1.283-.356-1.857M7 20H2v-2a3 3 0 0 1 5.356-1.857M7 20v-2c0-.656.126-1.283.356-1.857m0 0a5.002 5.002 0 0 1 9.288 0M15 7a3 3 0 1 1-6 0 3 3 0 0 1 6 0z"/></svg></div></div>
|
|
<div class="step-num">02</div>
|
|
<h3>Meet your mentor</h3>
|
|
<p>Paired with a current student at your target university or programme. They sat where you're sitting. They know exactly what to say yes and no to.</p>
|
|
<div class="step-time">Week 2 · <em>Peer-verified</em></div>
|
|
</div>
|
|
<div class="step-card reveal rd3">
|
|
<div class="step-head"><div class="step-tag">Step <em>03</em></div><div class="step-glyph"><svg viewBox="0 0 24 24"><path d="M9 5H7a2 2 0 0 0-2 2v12a2 2 0 0 0 2 2h10a2 2 0 0 0 2-2V7a2 2 0 0 0-2-2h-2M9 5a2 2 0 0 0 2 2h2a2 2 0 0 0 2-2M9 5a2 2 0 0 1 2-2h2a2 2 0 0 1 2 2m-6 9l2 2 4-4"/></svg></div></div>
|
|
<div class="step-num">03</div>
|
|
<h3>Apply with Zenna</h3>
|
|
<p>Draft your SOP, LORs, and CV with your mentor — all tracked in Zenna. Every document, every deadline, every status visible in real time.</p>
|
|
<div class="step-time">Weeks 3–10 · <em>95% hit rate</em></div>
|
|
</div>
|
|
<div class="step-card reveal rd4">
|
|
<div class="step-head"><div class="step-tag">Step <em>04</em></div><div class="step-glyph"><svg viewBox="0 0 24 24"><path d="M12 14l9-5-9-5-9 5 9 5zm0 0l6.16-3.422a12.083 12.083 0 0 1 .665 6.479A11.952 11.952 0 0 0 12 20.055a11.952 11.952 0 0 0-6.824-2.998 12.078 12.078 0 0 1 .665-6.479L12 14z"/></svg></div></div>
|
|
<div class="step-num">04</div>
|
|
<h3>Land & keep going</h3>
|
|
<p>Offer in hand, visa cleared, flight booked. We help with accommodation, blocked account, and ALPHA Bootcamp — your path to a German job.</p>
|
|
<div class="step-time">Post-admit · <em>End-to-end</em></div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
<!-- SERVICES -->
|
|
<section class="services-section" id="services">
|
|
<div class="container">
|
|
<div class="services-header reveal">
|
|
<div class="section-eyebrow center">What we do, in full</div>
|
|
<h2 class="section-title">Every service <em>you need</em>, nothing you don't.</h2>
|
|
<p class="section-intro">Modular. Transparent pricing. Pick what you need, skip what you don't.</p>
|
|
</div>
|
|
<div class="services-tabs">
|
|
<button class="services-tab active">Admissions</button>
|
|
<button class="services-tab">Documents</button>
|
|
<button class="services-tab">Visa & arrival</button>
|
|
<button class="services-tab">Career</button>
|
|
</div>
|
|
<div class="services-grid">
|
|
<div class="svc reveal rd1"><div class="svc-top"><div class="svc-code">S-01 · Core</div><div class="svc-icon"><svg viewBox="0 0 24 24"><path d="M12 3l9 6-9 6-9-6 9-6zm0 12l9-6M3 15l9-6"/></svg></div></div><h4>University shortlisting</h4><p>Matched to your profile, budget, and career goals — with real admit data from current students, not outdated rankings.</p><div class="svc-price"><span class="svc-price-val"><em>From</em>free</span><span class="svc-link">Learn more →</span></div></div>
|
|
<div class="svc reveal rd2"><div class="svc-top"><div class="svc-code">S-02</div><div class="svc-icon"><svg viewBox="0 0 24 24"><path d="M9 12h6m-6 4h6m2 5H7a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h5.586a1 1 0 0 1 .707.293l5.414 5.414a1 1 0 0 1 .293.707V19a2 2 0 0 1-2 2z"/></svg></div></div><h4>SOP & motivation letter</h4><p>Drafted with you, not for you. Reviewed by a current student in your target programme. Tailored to each university.</p><div class="svc-price"><span class="svc-price-val"><em>From</em>₹2,499</span><span class="svc-link">Learn more →</span></div></div>
|
|
<div class="svc ai reveal rd3"><div class="svc-top"><div class="svc-code">S-03 · <span class="svc-ai-badge">AI-assisted</span></div><div class="svc-icon"><svg viewBox="0 0 24 24"><path d="M12 2l2.4 7.4L22 12l-7.6 2.6L12 22l-2.4-7.4L2 12l7.6-2.6L12 2z"/></svg></div></div><h4>SOP Instant Review (beta)</h4><p>Upload your draft. Our AI flags structural issues, weak claims, and programme-fit gaps in seconds. A human mentor takes it further.</p><div class="svc-price"><span class="svc-price-val"><em>Free</em>beta</span><span class="svc-link">Try it →</span></div></div>
|
|
<div class="svc reveal rd1"><div class="svc-top"><div class="svc-code">S-04</div><div class="svc-icon"><svg viewBox="0 0 24 24"><path d="M4 4h16v16H4V4zm0 4h16m-8-4v16"/></svg></div></div><h4>Europass CV preparation</h4><p>Formatted to German academic standards, structured for uni-assist and DAAD compatibility.</p><div class="svc-price"><span class="svc-price-val"><em>From</em>₹1,499</span><span class="svc-link">Learn more →</span></div></div>
|
|
<div class="svc reveal rd2"><div class="svc-top"><div class="svc-code">S-05</div><div class="svc-icon"><svg viewBox="0 0 24 24"><path d="M21 13.255A23.931 23.931 0 0 1 12 15c-3.183 0-6.22-.62-9-1.745M16 6V4a2 2 0 0 0-2-2h-4a2 2 0 0 0-2 2v2m4 6h.01M5 20h14a2 2 0 0 0 2-2V8a2 2 0 0 0-2-2H5a2 2 0 0 0-2 2v10a2 2 0 0 0 2 2z"/></svg></div></div><h4>APS certificate support</h4><p>Document prep, interview dry-runs, and submission. The one gate every Indian applicant must clear.</p><div class="svc-price"><span class="svc-price-val"><em>From</em>₹4,999</span><span class="svc-link">Learn more →</span></div></div>
|
|
<div class="svc reveal rd3"><div class="svc-top"><div class="svc-code">S-06</div><div class="svc-icon"><svg viewBox="0 0 24 24"><path d="M10 6H5a2 2 0 0 0-2 2v9a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2V8a2 2 0 0 0-2-2h-5m-4 0V4a2 2 0 0 1 2-2h2a2 2 0 0 1 2 2v2"/></svg></div></div><h4>Visa application</h4><p>Cover letter, financial proof checklist, embassy appointment strategy. Consulate-specific nuance included.</p><div class="svc-price"><span class="svc-price-val"><em>From</em>₹3,499</span><span class="svc-link">Learn more →</span></div></div>
|
|
<div class="svc reveal rd1"><div class="svc-top"><div class="svc-code">S-07</div><div class="svc-icon"><svg viewBox="0 0 24 24"><path d="M3 7l9 6 9-6M5 19h14a2 2 0 0 0 2-2V7a2 2 0 0 0-2-2H5a2 2 0 0 0-2 2v10a2 2 0 0 0 2 2z"/></svg></div></div><h4>Blocked account setup</h4><p>Expatrio, Fintiba, Coracle — compared, booked, and activated with partner support.</p><div class="svc-price"><span class="svc-price-val"><em>From</em>free</span><span class="svc-link">Learn more →</span></div></div>
|
|
<div class="svc reveal rd2"><div class="svc-top"><div class="svc-code">S-08</div><div class="svc-icon"><svg viewBox="0 0 24 24"><path d="M3 12l2-2m0 0l7-7 7 7M5 10v10a1 1 0 0 0 1 1h3m10-11l2 2m-2-2v10a1 1 0 0 1-1 1h-3m-6 0a1 1 0 0 0 1-1v-4a1 1 0 0 1 1-1h2a1 1 0 0 1 1 1v4a1 1 0 0 0 1 1m-6 0h6"/></svg></div></div><h4>Accommodation search</h4><p>Student dorms, WG rooms, short stays. Peer-verified landlords who actually reply.</p><div class="svc-price"><span class="svc-price-val"><em>From</em>free</span><span class="svc-link">Learn more →</span></div></div>
|
|
<div class="svc reveal rd3"><div class="svc-top"><div class="svc-code">S-09</div><div class="svc-icon"><svg viewBox="0 0 24 24"><path d="M3 5a2 2 0 0 1 2-2h3.28a1 1 0 0 1 .948.684l1.498 4.493a1 1 0 0 1-.502 1.21l-2.257 1.13a11 11 0 0 0 5.516 5.516l1.13-2.257a1 1 0 0 1 1.21-.502l4.493 1.498a1 1 0 0 1 .684.949V19a2 2 0 0 1-2 2h-1C9.716 21 3 14.284 3 6V5z"/></svg></div></div><h4>German language coaching</h4><p>A1–B2 levels. Daily drills, uni-admission-weighted vocabulary.</p><div class="svc-price"><span class="svc-price-val"><em>From</em>₹8,999</span><span class="svc-link">Learn more →</span></div></div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
<!-- ZENNA PRODUCT -->
|
|
<section class="product-section" id="zenna">
|
|
<div class="container">
|
|
<div class="product-hero reveal">
|
|
<div>
|
|
<div class="product-pill">
|
|
<span class="pp-pill-tag">Product</span>
|
|
<span>Zenna · Built by LTA</span>
|
|
</div>
|
|
<h2 class="section-title">The application tracker <em>that respects your time.</em></h2>
|
|
<p class="section-intro" style="margin-bottom:32px;">No more "any update?" emails. Zenna gives every LTA student a live feed of their applications — document status, deadlines, mentor notes, decisions. Built in-house, used by 500+ students every day.</p>
|
|
<a href="#" class="btn btn-ghost"><span>Explore Zenna</span> <svg class="arrow" viewBox="0 0 16 16" fill="none"><path d="M1 8h14M9 2l6 6-6 6" stroke="currentColor" stroke-width="1.5"/></svg></a>
|
|
</div>
|
|
<div class="product-visual">
|
|
<div class="pv-header">
|
|
<div class="pv-tabs">
|
|
<span class="pv-tab on">Overview</span>
|
|
<span class="pv-tab">Apps</span>
|
|
<span class="pv-tab">Docs</span>
|
|
</div>
|
|
<span class="pv-stat">● 4 active</span>
|
|
</div>
|
|
<div class="pv-grid">
|
|
<div class="pv-applications">
|
|
<div class="pv-apps-title">Applications</div>
|
|
<div class="pv-app"><div class="pv-app-dot green"></div><div class="pv-app-name">TU München · M.Sc. CS</div><div class="pv-app-pct">72%</div></div>
|
|
<div class="pv-app"><div class="pv-app-dot amber"></div><div class="pv-app-name">RWTH Aachen · M.Sc. ME</div><div class="pv-app-pct">58%</div></div>
|
|
<div class="pv-app"><div class="pv-app-dot amber"></div><div class="pv-app-name">TU Dresden · M.Sc. CM</div><div class="pv-app-pct">45%</div></div>
|
|
<div class="pv-app"><div class="pv-app-dot gray"></div><div class="pv-app-name">TU Berlin · M.Sc. EE</div><div class="pv-app-pct">12%</div></div>
|
|
</div>
|
|
<div class="pv-chart">
|
|
<div class="pv-chart-title">Weekly progress</div>
|
|
<div class="pv-bars">
|
|
<div class="pv-bar" style="height:40%;"></div>
|
|
<div class="pv-bar" style="height:55%;"></div>
|
|
<div class="pv-bar" style="height:48%;"></div>
|
|
<div class="pv-bar" style="height:68%;"></div>
|
|
<div class="pv-bar" style="height:62%;"></div>
|
|
<div class="pv-bar" style="height:78%;"></div>
|
|
<div class="pv-bar" style="height:82%;"></div>
|
|
<div class="pv-bar" style="height:95%;"></div>
|
|
</div>
|
|
<div class="pv-chart-axis"><span>W 1</span><span>W 8</span></div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="product-features">
|
|
<div class="pf reveal rd1">
|
|
<div class="pf-icon"><svg viewBox="0 0 24 24"><path d="M13 10V3L4 14h7v7l9-11h-7z"/></svg></div>
|
|
<h4>Live status feed</h4>
|
|
<p>Every document, every university, every deadline — updated the moment something changes.</p>
|
|
</div>
|
|
<div class="pf reveal rd2">
|
|
<div class="pf-icon"><svg viewBox="0 0 24 24"><path d="M21 13.255A23.931 23.931 0 0 1 12 15c-3.183 0-6.22-.62-9-1.745M16 6V4a2 2 0 0 0-2-2h-4a2 2 0 0 0-2 2v2m4 6h.01M5 20h14a2 2 0 0 0 2-2V8a2 2 0 0 0-2-2H5a2 2 0 0 0-2 2v10a2 2 0 0 0 2 2z"/></svg></div>
|
|
<h4>Mentor-linked</h4>
|
|
<p>Your mentor sees what you see. Comments, edits, and approvals happen in-app — no more WhatsApp chaos.</p>
|
|
</div>
|
|
<div class="pf reveal rd3">
|
|
<div class="pf-icon"><svg viewBox="0 0 24 24"><path d="M12 8v4l3 3m6-3a9 9 0 1 1-18 0 9 9 0 0 1 18 0z"/></svg></div>
|
|
<h4>Deadline-aware</h4>
|
|
<p>Every application on your dashboard has a countdown. Miss nothing. Sleep at night.</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
<!-- ALPHA -->
|
|
<section class="alpha-section" id="alpha">
|
|
<div class="container">
|
|
<div class="alpha-hero reveal">
|
|
<div>
|
|
<div class="section-eyebrow">ALPHA Career Bootcamp</div>
|
|
<h2 class="section-title">From offer letter <em>to first job in Germany.</em></h2>
|
|
<p class="section-intro" style="margin-bottom:36px;">Admission is half the journey. ALPHA is where we help you land your first Werkstudent role, internship, or Abschlussarbeit — through people already working at the companies you want.</p>
|
|
<a href="#" class="btn btn-ghost"><span>Join ALPHA · 47th cohort</span> <svg class="arrow" viewBox="0 0 16 16" fill="none"><path d="M1 8h14M9 2l6 6-6 6" stroke="currentColor" stroke-width="1.5"/></svg></a>
|
|
</div>
|
|
<div class="alpha-board">
|
|
<div class="ab-top">
|
|
<div class="ab-title">
|
|
<div class="ab-logo">α</div>
|
|
<div class="ab-title-t">ALPHA · Bootcamp</div>
|
|
</div>
|
|
<div class="ab-status">● Active cohort</div>
|
|
</div>
|
|
<div class="ab-h">Hiring partners</div>
|
|
<div class="partners-grid">
|
|
<div class="partner-card"><span class="partner-card-name">BMW</span><span class="partner-card-meta">Munich</span></div>
|
|
<div class="partner-card"><span class="partner-card-name">SAP</span><span class="partner-card-meta">Walldorf</span></div>
|
|
<div class="partner-card"><span class="partner-card-name">Siemens</span><span class="partner-card-meta">Berlin</span></div>
|
|
<div class="partner-card"><span class="partner-card-name">Bosch</span><span class="partner-card-meta">Stuttgart</span></div>
|
|
<div class="partner-card"><span class="partner-card-name">RFA</span><span class="partner-card-meta">Augsburg</span></div>
|
|
<div class="partner-card"><span class="partner-card-name">+34 more</span><span class="partner-card-meta">across DE</span></div>
|
|
</div>
|
|
<div class="ab-metrics">
|
|
<div class="ab-metric"><div class="ab-metric-val">12w</div><div class="ab-metric-lbl">Programme</div></div>
|
|
<div class="ab-metric"><div class="ab-metric-val">1:1</div><div class="ab-metric-lbl">Coaching</div></div>
|
|
<div class="ab-metric"><div class="ab-metric-val">83%</div><div class="ab-metric-lbl">Placement</div></div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
<!-- TESTIMONIALS -->
|
|
<section class="log-section" id="voices">
|
|
<div class="log-header reveal">
|
|
<div class="section-eyebrow center">What students say</div>
|
|
<h2 class="section-title">They made it. <em>You're next.</em></h2>
|
|
</div>
|
|
<div class="log-track">
|
|
<div class="log-entry"><div class="log-top"><span>Winter '25 · Admitted</span><span class="log-stars">★ ★ ★ ★ ★</span></div><p class="log-quote">Grateful for LTA's support in securing my top university admission. It wouldn't have been possible without them.</p><div class="log-person"><div class="log-avatar a1">SJ</div><div><div class="log-name">Stephin Joseph</div><div class="log-meta">M.Sc. Logistics · Uni Duisburg-Essen</div></div></div></div>
|
|
<div class="log-entry"><div class="log-top"><span>Winter '24 · Admitted</span><span class="log-stars">★ ★ ★ ★ ★</span></div><p class="log-quote">With IELTS 6 and only 120 ECTS, I never thought I'd land four offer letters. LTA's shortlist was spot on.</p><div class="log-person"><div class="log-avatar a2">GT</div><div><div class="log-name">Gladia Thomas</div><div class="log-meta">M.Sc. Biodiversity · TU Dresden</div></div></div></div>
|
|
<div class="log-entry"><div class="log-top"><span>Winter '25 · Admitted</span><span class="log-stars">★ ★ ★ ★ ★</span></div><p class="log-quote">Every concern was handled with patience, and my applications went in on time. Support has been amazing.</p><div class="log-person"><div class="log-avatar a3">FS</div><div><div class="log-name">Fathima Sulaiman</div><div class="log-meta">M.Sc. Biogenic Resources · TUM</div></div></div></div>
|
|
<div class="log-entry"><div class="log-top"><span>Winter '24 · Admitted</span><span class="log-stars">★ ★ ★ ★ ★</span></div><p class="log-quote">Their guidance was essential in helping me gain admission to a top university. Incredibly grateful.</p><div class="log-person"><div class="log-avatar a4">RP</div><div><div class="log-name">Rizvan PM</div><div class="log-meta">M.Sc. Physics · Uni Paderborn</div></div></div></div>
|
|
<div class="log-entry"><div class="log-top"><span>Summer '25 · Admitted</span><span class="log-stars">★ ★ ★ ★ ★</span></div><p class="log-quote">LTA made the application process smooth and were always there to answer my questions. A fantastic experience.</p><div class="log-person"><div class="log-avatar a5">HU</div><div><div class="log-name">Haritha Unni</div><div class="log-meta">M.Sc. Polymer Science · FU Berlin</div></div></div></div>
|
|
<div class="log-entry"><div class="log-top"><span>Winter '25 · Admitted</span><span class="log-stars">★ ★ ★ ★ ★</span></div><p class="log-quote">Securing admission to a prestigious university seemed daunting, but LTA made it possible.</p><div class="log-person"><div class="log-avatar a6">SM</div><div><div class="log-name">Shawn M. Mathew</div><div class="log-meta">M.Sc. Intelligent Manufacturing · TU Clausthal</div></div></div></div>
|
|
<div class="log-entry"><div class="log-top"><span>Winter '25 · Admitted</span><span class="log-stars">★ ★ ★ ★ ★</span></div><p class="log-quote">Grateful for LTA's support in securing my top university admission.</p><div class="log-person"><div class="log-avatar a1">SJ</div><div><div class="log-name">Stephin Joseph</div><div class="log-meta">M.Sc. Logistics · Uni Duisburg-Essen</div></div></div></div>
|
|
<div class="log-entry"><div class="log-top"><span>Winter '24 · Admitted</span><span class="log-stars">★ ★ ★ ★ ★</span></div><p class="log-quote">With IELTS 6 and only 120 ECTS, I landed four offer letters.</p><div class="log-person"><div class="log-avatar a2">GT</div><div><div class="log-name">Gladia Thomas</div><div class="log-meta">M.Sc. Biodiversity · TU Dresden</div></div></div></div>
|
|
</div>
|
|
</section>
|
|
|
|
<!-- AWARDS -->
|
|
<section class="awards-section" id="awards">
|
|
<div class="container">
|
|
<div class="awards-header reveal">
|
|
<div class="section-eyebrow center">Recognition</div>
|
|
<h2 class="section-title">Awards & <em>recognition.</em></h2>
|
|
<p class="section-intro">Independent recognition from publications, accelerators, and partners — because trust shouldn't be self-declared.</p>
|
|
</div>
|
|
|
|
<div class="awards-grid">
|
|
<!-- Featured large award card -->
|
|
<div class="award-card-big reveal rd1">
|
|
<div class="acb-bg-glow"></div>
|
|
<div class="acb-icon">
|
|
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5">
|
|
<path d="M12 15a7 7 0 1 0 0-14 7 7 0 0 0 0 14z"/>
|
|
<path d="M8.21 13.89L7 23l5-3 5 3-1.21-9.12"/>
|
|
</svg>
|
|
</div>
|
|
<div class="acb-year">2024</div>
|
|
<div class="acb-title">Top 20 Student Communities</div>
|
|
<div class="acb-publisher">YourStory Annual Awards</div>
|
|
<p class="acb-desc">Featured among India's top 20 student-built communities driving education access. Recognised for our peer-mentor model and case-study transparency.</p>
|
|
<a href="#" class="acb-link">Read the feature →</a>
|
|
</div>
|
|
|
|
<!-- Smaller awards stack -->
|
|
<div class="awards-stack">
|
|
<div class="award-card-sm reveal rd2">
|
|
<div class="acs-icon">
|
|
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5"><path d="M12 2l3 7h7l-5.5 4.5L18 21l-6-4-6 4 1.5-7.5L2 9h7z"/></svg>
|
|
</div>
|
|
<div class="acs-body">
|
|
<div class="acs-year">2024</div>
|
|
<div class="acs-title">EdTech Innovation Award</div>
|
|
<div class="acs-publisher">NASSCOM India</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="award-card-sm reveal rd3">
|
|
<div class="acs-icon">
|
|
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5"><rect x="3" y="4" width="18" height="16" rx="2"/><path d="M7 8h10M7 12h10M7 16h7"/></svg>
|
|
</div>
|
|
<div class="acs-body">
|
|
<div class="acs-year">2023</div>
|
|
<div class="acs-title">Featured in The Hindu</div>
|
|
<div class="acs-publisher">Education feature, national</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="award-card-sm reveal rd4">
|
|
<div class="acs-icon">
|
|
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5"><circle cx="12" cy="12" r="9"/><path d="M3 12h18M12 3a14 14 0 0 1 0 18M12 3a14 14 0 0 0 0 18"/></svg>
|
|
</div>
|
|
<div class="acs-body">
|
|
<div class="acs-year">2024</div>
|
|
<div class="acs-title">DAAD India Partner</div>
|
|
<div class="acs-publisher">Community support programme</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="award-card-sm reveal rd1">
|
|
<div class="acs-icon">
|
|
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5"><path d="M12 2v20M2 12h20"/><circle cx="12" cy="12" r="9"/></svg>
|
|
</div>
|
|
<div class="acs-body">
|
|
<div class="acs-year">2025</div>
|
|
<div class="acs-title">5,000+ Instagram community</div>
|
|
<div class="acs-publisher">@letterstoabroad_</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Press strip below -->
|
|
<div class="press-strip reveal">
|
|
<div class="ps-label">Mentioned in</div>
|
|
<div class="ps-marquee">
|
|
<span class="ps-item">YourStory</span>
|
|
<span class="ps-item">The Hindu</span>
|
|
<span class="ps-item">Inc42</span>
|
|
<span class="ps-item">DAAD India</span>
|
|
<span class="ps-item">NASSCOM</span>
|
|
<span class="ps-item">The New Indian Express</span>
|
|
<span class="ps-item">Manorama</span>
|
|
<span class="ps-item">YourStory</span>
|
|
<span class="ps-item">The Hindu</span>
|
|
<span class="ps-item">Inc42</span>
|
|
<span class="ps-item">DAAD India</span>
|
|
<span class="ps-item">NASSCOM</span>
|
|
<span class="ps-item">The New Indian Express</span>
|
|
<span class="ps-item">Manorama</span>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
<!-- PACKAGES -->
|
|
<section class="packages-section" id="packages">
|
|
<div class="container">
|
|
<div class="pkg-header reveal">
|
|
<div class="section-eyebrow center">Packages</div>
|
|
<h2 class="section-title">Pick your <em>level of support.</em></h2>
|
|
<p class="section-intro">Transparent, modular, no hidden fees. Start free with the Community tier, or pick a guided package — your call.</p>
|
|
</div>
|
|
|
|
<!-- COMMUNITY FREE BANNER -->
|
|
<div class="pkg-free-banner reveal">
|
|
<div class="pfb-left">
|
|
<div class="pfb-tag">Always free · Tier 00</div>
|
|
<h3 class="pfb-name"><em>Community</em></h3>
|
|
<p class="pfb-sub">For the independent applicant who wants access to tools, peers, and the network — but is doing the heavy lifting solo.</p>
|
|
</div>
|
|
<div class="pfb-features">
|
|
<div class="pfb-feat"><svg viewBox="0 0 16 16"><path d="M2 8l4 4 8-8"/></svg>All free tools (grade, ECTS, APS)</div>
|
|
<div class="pfb-feat"><svg viewBox="0 0 16 16"><path d="M2 8l4 4 8-8"/></svg>Peer community access</div>
|
|
<div class="pfb-feat"><svg viewBox="0 0 16 16"><path d="M2 8l4 4 8-8"/></svg>Legal aid network access</div>
|
|
<div class="pfb-feat"><svg viewBox="0 0 16 16"><path d="M2 8l4 4 8-8"/></svg>Events & workshops</div>
|
|
</div>
|
|
<div class="pfb-right">
|
|
<div class="pfb-price"><span class="pfb-price-val">₹0</span><span class="pfb-price-note">/ always free</span></div>
|
|
<a href="#start" class="btn btn-ghost"><span>Join free</span> <svg class="arrow" viewBox="0 0 16 16" fill="none"><path d="M1 8h14M9 2l6 6-6 6" stroke="currentColor" stroke-width="1.5"/></svg></a>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="packages-grid">
|
|
<!-- FOUNDATION -->
|
|
<div class="pkg reveal rd1">
|
|
<div class="pkg-tier">Tier 01 · Foundation</div>
|
|
<div class="pkg-name"><em>Foundation</em></div>
|
|
<p class="pkg-sub">For students who've done their own course shortlisting and need help executing the application, visa, and arrival logistics.</p>
|
|
<div class="pkg-price"><span class="pkg-price-val">₹54,999</span><span class="pkg-price-note">/ total advance</span></div>
|
|
<div class="pkg-fee-note">Enrolment ₹10,000 · Initial ₹5,000 · No refund</div>
|
|
<div class="pkg-section-title">Application & admissions</div>
|
|
<ul class="pkg-list">
|
|
<li><svg viewBox="0 0 16 16"><path d="M2 8l4 4 8-8"/></svg>3–4 applications · 1 intake</li>
|
|
<li><svg viewBox="0 0 16 16"><path d="M2 8l4 4 8-8"/></svg>Zenna application tracker</li>
|
|
<li><svg viewBox="0 0 16 16"><path d="M2 8l4 4 8-8"/></svg>Student-selected courses</li>
|
|
</ul>
|
|
<div class="pkg-section-title">Visa & compliance</div>
|
|
<ul class="pkg-list">
|
|
<li><svg viewBox="0 0 16 16"><path d="M2 8l4 4 8-8"/></svg>Visa assistance</li>
|
|
<li><svg viewBox="0 0 16 16"><path d="M2 8l4 4 8-8"/></svg>Blocked account setup</li>
|
|
<li><svg viewBox="0 0 16 16"><path d="M2 8l4 4 8-8"/></svg>Health insurance setup</li>
|
|
</ul>
|
|
<a href="#start" class="pkg-cta">Choose Foundation</a>
|
|
</div>
|
|
|
|
<!-- ACCELERATOR (FEATURED) -->
|
|
<div class="pkg featured reveal rd2">
|
|
<div class="pkg-badge">Most chosen</div>
|
|
<div class="pkg-tier">Tier 02 · Accelerator</div>
|
|
<div class="pkg-name"><em>Accelerator</em></div>
|
|
<p class="pkg-sub">Expert-led shortlisting, 8 applications, and full LTA Connect access — for students who want guided strategy on top of execution.</p>
|
|
<div class="pkg-price"><span class="pkg-price-val">₹1,14,999</span><span class="pkg-price-note">/ total advance</span></div>
|
|
<div class="pkg-fee-note">Enrolment ₹15,000 · Initial ₹5,000 · No refund</div>
|
|
<div class="pkg-section-title">Application & admissions</div>
|
|
<ul class="pkg-list">
|
|
<li><svg viewBox="0 0 16 16"><path d="M2 8l4 4 8-8"/></svg>8 applications · 1 intake</li>
|
|
<li><svg viewBox="0 0 16 16"><path d="M2 8l4 4 8-8"/></svg>Zenna application tracker</li>
|
|
<li><svg viewBox="0 0 16 16"><path d="M2 8l4 4 8-8"/></svg>LTA Connect</li>
|
|
<li><svg viewBox="0 0 16 16"><path d="M2 8l4 4 8-8"/></svg>Expert-led shortlisting session</li>
|
|
</ul>
|
|
<div class="pkg-section-title">Visa & compliance</div>
|
|
<ul class="pkg-list">
|
|
<li><svg viewBox="0 0 16 16"><path d="M2 8l4 4 8-8"/></svg>Visa assistance</li>
|
|
<li><svg viewBox="0 0 16 16"><path d="M2 8l4 4 8-8"/></svg>Blocked account setup</li>
|
|
<li><svg viewBox="0 0 16 16"><path d="M2 8l4 4 8-8"/></svg>Health insurance setup</li>
|
|
</ul>
|
|
<a href="#start" class="pkg-cta">Choose Accelerator</a>
|
|
</div>
|
|
|
|
<!-- SUPERNOVA -->
|
|
<div class="pkg reveal rd3">
|
|
<div class="pkg-tier">Tier 03 · Supernova</div>
|
|
<div class="pkg-name"><em>Supernova</em></div>
|
|
<p class="pkg-sub">Unlimited applications, 3 intakes, full ALPHA bootcamp, and 45 days of post-arrival concierge — the complete journey end-to-end.</p>
|
|
<div class="pkg-price"><span class="pkg-price-val">₹1,96,000</span><span class="pkg-price-note">/ total advance</span></div>
|
|
<div class="pkg-fee-note">Enrolment ₹25,000 · Initial ₹5,000 · No refund</div>
|
|
<div class="pkg-section-title">Application & admissions</div>
|
|
<ul class="pkg-list">
|
|
<li><svg viewBox="0 0 16 16"><path d="M2 8l4 4 8-8"/></svg>Unlimited courses · 3 intakes</li>
|
|
<li><svg viewBox="0 0 16 16"><path d="M2 8l4 4 8-8"/></svg>LTA shortlisting (up to 18)</li>
|
|
<li><svg viewBox="0 0 16 16"><path d="M2 8l4 4 8-8"/></svg>Zenna · LTA Connect · Expert sessions</li>
|
|
</ul>
|
|
<div class="pkg-section-title">Arrival, language & career</div>
|
|
<ul class="pkg-list">
|
|
<li><svg viewBox="0 0 16 16"><path d="M2 8l4 4 8-8"/></svg>German A1 & A2</li>
|
|
<li><svg viewBox="0 0 16 16"><path d="M2 8l4 4 8-8"/></svg>ALPHA Career Bootcamp</li>
|
|
<li><svg viewBox="0 0 16 16"><path d="M2 8l4 4 8-8"/></svg>Airport pickup & drop</li>
|
|
<li><svg viewBox="0 0 16 16"><path d="M2 8l4 4 8-8"/></svg>45 days post-arrival support</li>
|
|
<li><svg viewBox="0 0 16 16"><path d="M2 8l4 4 8-8"/></svg>Anmeldung · SIM · Deutschland Ticket</li>
|
|
<li><svg viewBox="0 0 16 16"><path d="M2 8l4 4 8-8"/></svg>Forex & education-loan partners</li>
|
|
</ul>
|
|
<a href="#start" class="pkg-cta">Go Supernova</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
<!-- TOOLS -->
|
|
<section class="tools-section" id="tools">
|
|
<div class="container">
|
|
<div class="tools-header reveal">
|
|
<div class="section-eyebrow center">Free tools</div>
|
|
<h2 class="section-title">Use these before you <em>sign up anywhere.</em></h2>
|
|
<p class="section-intro">No email wall. No sign-in. These work for everyone — LTA students, strangers, our competitors' customers. If they help, come back. If they don't, you lose nothing.</p>
|
|
</div>
|
|
<div class="tools-grid">
|
|
<div class="tool-card reveal rd1"><div class="tool-preview"><div class="tool-value">1.8<small>/4.0</small></div></div><div class="tool-title">German grade converter</div><div class="tool-desc">Convert your Indian CGPA or percentage into the German 1.0–4.0 scale used by every university.</div><span class="tool-use">Run converter →</span></div>
|
|
<div class="tool-card reveal rd2"><div class="tool-preview"><div class="tool-value">178<small>ECTS</small></div></div><div class="tool-title">ECTS credit calculator</div><div class="tool-desc">How many ECTS does your undergrad actually carry? Most Indian degrees qualify — we show you exactly.</div><span class="tool-use">Calculate →</span></div>
|
|
<div class="tool-card reveal rd3"><div class="tool-preview"><div class="tool-value">7.5<small>IELTS</small></div></div><div class="tool-title">IELTS ↔ TOEFL</div><div class="tool-desc">Two tests, one language. Map between IELTS, TOEFL iBT, and Duolingo quickly.</div><span class="tool-use">Convert →</span></div>
|
|
<div class="tool-card reveal rd4"><div class="tool-preview"><div class="tool-value">✓<small>eligible</small></div></div><div class="tool-title">APS eligibility quiz</div><div class="tool-desc">Find out in 60 seconds whether you need an APS certificate — and which documents will trip you.</div><span class="tool-use">Take quiz →</span></div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
<!-- CASE STUDIES -->
|
|
<section class="case-section" id="cases">
|
|
<div class="container">
|
|
<div class="case-header reveal">
|
|
<div class="section-eyebrow center case-eyebrow-red">Case studies · Scam alerts</div>
|
|
<h2 class="section-title">The dark side of study-abroad, <em>documented.</em></h2>
|
|
<p class="section-intro">Real cases. Real losses. Real outcomes. We publish these because every student planning to move abroad deserves to know what the agency industry actually looks like — and that help exists when things go wrong.</p>
|
|
</div>
|
|
<div class="case-grid">
|
|
<div class="case-card reveal rd1">
|
|
<div class="case-top"><div class="case-tag">Scam alert</div><div class="case-meta"><strong>Kochi, KL</strong>Nov 2024</div></div>
|
|
<div class="case-body">
|
|
<h3 class="case-h">Agency charged ₹2.8L for a TUM admit <em>they never even applied for.</em></h3>
|
|
<dl class="case-narrative">
|
|
<dt>What happened</dt>
|
|
<dd>Student paid <strong>₹2,80,000</strong> upfront to a Kochi-based "consultancy" promising guaranteed admission to TU Munich. Application was never submitted to the university.</dd>
|
|
<dt>How LTA helped</dt>
|
|
<dd>Connected the student with our <strong>Kochi legal partner within 36 hours</strong>. Free initial consultation, case filed under consumer protection act.</dd>
|
|
<dt>Outcome</dt>
|
|
<dd><strong>Full refund recovered.</strong> Agency's GST registration under review by tax authorities.</dd>
|
|
</dl>
|
|
<p class="case-quote">"I was ready to give up and tell my parents I'd wasted their savings. LTA's lawyer called me within a day. Got every rupee back."</p>
|
|
<div class="case-foot">
|
|
<div class="case-student">
|
|
<div class="case-avatar">SR</div>
|
|
<div class="case-student-info"><strong>S.R. (Anonymised)</strong>Mech. Engg · Cochin</div>
|
|
</div>
|
|
<a href="#" class="case-read">Read full case →</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="case-card reveal rd2">
|
|
<div class="case-top"><div class="case-tag">Scam alert</div><div class="case-meta"><strong>Hyderabad, TG</strong>Jan 2025</div></div>
|
|
<div class="case-body">
|
|
<h3 class="case-h">Fake offer letter from "RWTH Aachen" used to <em>scam 14 students.</em></h3>
|
|
<dl class="case-narrative">
|
|
<dt>What happened</dt>
|
|
<dd>Single agent issued <strong>14 forged offer letters</strong> from RWTH Aachen to collect ₹1.5L–₹3L "processing fees" per student. Students discovered the fraud only at visa interview.</dd>
|
|
<dt>How LTA helped</dt>
|
|
<dd>Consolidated all 14 students into a <strong>single group case</strong> with our Hyderabad legal partner. FIR filed at Cyberabad police station.</dd>
|
|
<dt>Outcome</dt>
|
|
<dd>Agent arrested under Sections 420, 468 IPC. <strong>11 of 14 students refunded.</strong> Case referenced in DAAD India fraud advisory.</dd>
|
|
</dl>
|
|
<p class="case-quote">"We thought we were alone. Turns out we were 14. LTA made us a group — that's when everything changed."</p>
|
|
<div class="case-foot">
|
|
<div class="case-student">
|
|
<div class="case-avatar">AK</div>
|
|
<div class="case-student-info"><strong>A.K. + 13 others</strong>Various programmes · Hyderabad</div>
|
|
</div>
|
|
<a href="#" class="case-read">Read full case →</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="case-card reveal rd3">
|
|
<div class="case-top"><div class="case-tag">Scam alert</div><div class="case-meta"><strong>Bengaluru, KA</strong>Mar 2025</div></div>
|
|
<div class="case-body">
|
|
<h3 class="case-h">Blocked account deposit <em>vanished overnight.</em></h3>
|
|
<dl class="case-narrative">
|
|
<dt>What happened</dt>
|
|
<dd>Student transferred <strong>€11,208</strong> for blocked account through an "approved agent." Money was routed to a personal account, not the bank. Agent disappeared.</dd>
|
|
<dt>How LTA helped</dt>
|
|
<dd>Flagged the fake agent to Fintiba directly (we're official partner). <strong>Bengaluru cyber cell notified within 4 hours.</strong></dd>
|
|
<dt>Outcome</dt>
|
|
<dd>Cyber cell traced transaction; <strong>€9,800 recovered.</strong> Fake "Fintiba verified" badge removed from 3 other websites after our report.</dd>
|
|
</dl>
|
|
<p class="case-quote">"The money was my entire visa proof. Losing it meant losing the admit. LTA found a cyber lawyer who knew exactly what to do."</p>
|
|
<div class="case-foot">
|
|
<div class="case-student">
|
|
<div class="case-avatar">VP</div>
|
|
<div class="case-student-info"><strong>V.P. (Anonymised)</strong>Comp. Sci · Bengaluru</div>
|
|
</div>
|
|
<a href="#" class="case-read">Read full case →</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="case-card reveal rd4">
|
|
<div class="case-top"><div class="case-tag">Scam alert</div><div class="case-meta"><strong>Chennai, TN</strong>Aug 2024</div></div>
|
|
<div class="case-body">
|
|
<h3 class="case-h">APS "fast track" racket charged ₹45,000 for <em>a free process.</em></h3>
|
|
<dl class="case-narrative">
|
|
<dt>What happened</dt>
|
|
<dd>Agent claimed they could "expedite" APS verification for <strong>₹45,000</strong>. In reality, APS is a standard ₹18,500 process with no expediting available.</dd>
|
|
<dt>How LTA helped</dt>
|
|
<dd>Partnered with <strong>6 Chennai students</strong> hit by the same agent. Chennai legal team filed a class complaint under the MRTP Act.</dd>
|
|
<dt>Outcome</dt>
|
|
<dd><strong>All 6 students refunded.</strong> Agent's consumer licence suspended.</dd>
|
|
</dl>
|
|
<p class="case-quote">"I almost paid. My mentor on LTA said 'stop, call this number first.' That phone call saved ₹45,000 — and four months of my life."</p>
|
|
<div class="case-foot">
|
|
<div class="case-student">
|
|
<div class="case-avatar">MP</div>
|
|
<div class="case-student-info"><strong>M.P. + 5 others</strong>Various · Chennai</div>
|
|
</div>
|
|
<a href="#" class="case-read">Read full case →</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<p class="case-disclaimer">All case details published with student consent · Names anonymised to initials · Documentation available on request · Cases updated quarterly</p>
|
|
</div>
|
|
</section>
|
|
|
|
<!-- LEGAL AID -->
|
|
<section class="legal-section" id="legal">
|
|
<div class="container">
|
|
<div class="legal-hero">
|
|
<div class="reveal">
|
|
<div class="legal-badge">
|
|
<span class="legal-badge-tag">Free community service</span>
|
|
<span>Legal Aid Network</span>
|
|
</div>
|
|
<h2 class="legal-h">Got scammed? <em>We have a lawyer in your city.</em></h2>
|
|
<p class="legal-p">A pan-India network of verified lawyers — mapped to your city — offering free first consultations to study-abroad scam victims. Open to every student, LTA or not. You don't pay us. You don't owe us. You just need help.</p>
|
|
<div class="legal-features">
|
|
<div class="legal-feat">
|
|
<div class="legal-feat-icon"><svg viewBox="0 0 24 24"><path d="M12 8v4m0 4h.01M21 12a9 9 0 1 1-18 0 9 9 0 0 1 18 0z"/></svg></div>
|
|
<div class="legal-feat-text"><strong>First consultation — always free</strong><span>Every lawyer on our network has committed to no-fee first calls, regardless of case outcome.</span></div>
|
|
</div>
|
|
<div class="legal-feat">
|
|
<div class="legal-feat-icon"><svg viewBox="0 0 24 24"><path d="M17.657 16.657L13.414 20.9a2 2 0 0 1-2.827 0l-4.244-4.243a8 8 0 1 1 11.314 0zM15 11a3 3 0 1 1-6 0 3 3 0 0 1 6 0z"/></svg></div>
|
|
<div class="legal-feat-text"><strong>Same-city, same-state pairing</strong><span>You're matched with a lawyer in the city the scam happened — not a call centre two states away.</span></div>
|
|
</div>
|
|
<div class="legal-feat">
|
|
<div class="legal-feat-icon"><svg viewBox="0 0 24 24"><path d="M12 8v4l3 3m6-3a9 9 0 1 1-18 0 9 9 0 0 1 18 0z"/></svg></div>
|
|
<div class="legal-feat-text"><strong>Connected within 48 hours</strong><span>Submit case → LTA team reviews → lawyer on a call with you. Within two working days.</span></div>
|
|
</div>
|
|
</div>
|
|
<a href="#" class="btn btn-primary">
|
|
<span>Request legal aid — free</span>
|
|
<svg class="arrow" viewBox="0 0 16 16" fill="none"><path d="M1 8h14M9 2l6 6-6 6" stroke="currentColor" stroke-width="1.5"/></svg>
|
|
</a>
|
|
</div>
|
|
|
|
<div class="india-map reveal rd1">
|
|
<div class="map-header">
|
|
<div class="map-title">
|
|
<div class="map-title-icon"><svg viewBox="0 0 24 24"><path d="M12 2C8.134 2 5 5.134 5 9c0 5.25 7 13 7 13s7-7.75 7-13c0-3.866-3.134-7-7-7zm0 9.5a2.5 2.5 0 1 1 0-5 2.5 2.5 0 0 1 0 5z"/></svg></div>
|
|
<div class="map-title-t">Legal network · Live coverage</div>
|
|
</div>
|
|
<div class="map-live">Active</div>
|
|
</div>
|
|
|
|
<div class="map-svg-wrap">
|
|
<svg class="map-svg" viewBox="0 0 400 500" xmlns="http://www.w3.org/2000/svg">
|
|
<!-- Accurate India outline: NW Kashmir → Punjab → Rajasthan/Gujarat hook → Mumbai coast → Goa/Karnataka → Kerala/Cape Comorin tip → Tamil Nadu → Andhra coast → Odisha → West Bengal → Northeast (Assam/7 sisters) → Sikkim → Himalaya line back to Kashmir -->
|
|
<path class="map-india-shape" d="
|
|
M 145 65
|
|
L 165 50
|
|
C 180 42, 200 40, 215 48
|
|
L 232 58
|
|
C 245 65, 252 78, 258 90
|
|
L 275 95
|
|
C 290 92, 305 95, 312 105
|
|
L 320 118
|
|
C 322 128, 315 138, 305 142
|
|
L 290 145
|
|
L 280 155
|
|
C 285 168, 290 178, 296 188
|
|
L 310 200
|
|
L 325 195
|
|
L 340 192
|
|
L 348 200
|
|
C 352 215, 348 230, 340 240
|
|
L 332 252
|
|
L 322 268
|
|
C 312 270, 302 268, 295 260
|
|
L 285 250
|
|
L 275 248
|
|
L 270 260
|
|
C 268 275, 270 290, 275 305
|
|
L 280 322
|
|
C 280 340, 273 358, 262 372
|
|
L 248 388
|
|
C 235 402, 220 412, 205 420
|
|
L 195 432
|
|
L 188 445
|
|
L 180 458
|
|
C 175 466, 170 470, 165 462
|
|
L 162 450
|
|
L 158 435
|
|
C 155 420, 152 405, 150 392
|
|
L 148 378
|
|
C 144 365, 138 352, 130 340
|
|
L 122 325
|
|
C 118 310, 116 295, 116 280
|
|
L 118 265
|
|
C 116 250, 110 238, 102 228
|
|
L 95 218
|
|
C 88 208, 85 195, 88 182
|
|
L 95 168
|
|
L 105 155
|
|
C 110 145, 110 132, 105 122
|
|
L 100 110
|
|
C 100 98, 105 88, 115 82
|
|
L 128 78
|
|
L 138 70
|
|
Z" />
|
|
|
|
<!-- Northeast extension (Assam, 7 sisters) -->
|
|
<path class="map-india-shape" d="
|
|
M 340 192
|
|
L 350 188
|
|
C 360 184, 372 184, 378 192
|
|
L 382 202
|
|
C 380 215, 372 222, 362 222
|
|
L 350 220
|
|
L 345 210
|
|
Z" />
|
|
|
|
<!-- Sri Lanka (decorative) -->
|
|
<ellipse cx="218" cy="475" rx="9" ry="14" fill="rgba(123,90,232,0.06)" stroke="var(--violet)" stroke-width="0.5" stroke-opacity="0.3"/>
|
|
|
|
<!-- Chandigarh (NW) -->
|
|
<circle class="map-dot-pulse" cx="180" cy="90" r="10"><animate attributeName="r" values="6;14;6" dur="2.5s" repeatCount="indefinite"/><animate attributeName="opacity" values="0.5;0.1;0.5" dur="2.5s" repeatCount="indefinite"/></circle>
|
|
<circle class="map-dot" cx="180" cy="90" r="5"/>
|
|
<text class="map-city-label" x="193" y="94">Chandigarh</text>
|
|
|
|
<!-- Delhi -->
|
|
<circle class="map-dot-pulse" cx="195" cy="125" r="10"><animate attributeName="r" values="6;14;6" dur="2s" repeatCount="indefinite"/><animate attributeName="opacity" values="0.5;0.1;0.5" dur="2s" repeatCount="indefinite"/></circle>
|
|
<circle class="map-dot" cx="195" cy="125" r="5"/>
|
|
<text class="map-city-label" x="208" y="129">Delhi</text>
|
|
|
|
<!-- Jaipur -->
|
|
<circle class="map-dot-pulse" cx="170" cy="155" r="10"><animate attributeName="r" values="6;14;6" dur="2.2s" repeatCount="indefinite"/><animate attributeName="opacity" values="0.5;0.1;0.5" dur="2.2s" repeatCount="indefinite"/></circle>
|
|
<circle class="map-dot" cx="170" cy="155" r="5"/>
|
|
<text class="map-city-label" x="138" y="148">Jaipur</text>
|
|
|
|
<!-- Ahmedabad (Gujarat) -->
|
|
<circle class="map-dot-pulse" cx="135" cy="200" r="10"><animate attributeName="r" values="6;14;6" dur="2.4s" repeatCount="indefinite"/><animate attributeName="opacity" values="0.5;0.1;0.5" dur="2.4s" repeatCount="indefinite"/></circle>
|
|
<circle class="map-dot" cx="135" cy="200" r="5"/>
|
|
<text class="map-city-label" x="65" y="204">Ahmedabad</text>
|
|
|
|
<!-- Kolkata (East) -->
|
|
<circle class="map-dot-pulse" cx="305" cy="220" r="10"><animate attributeName="r" values="6;14;6" dur="2.5s" repeatCount="indefinite"/><animate attributeName="opacity" values="0.5;0.1;0.5" dur="2.5s" repeatCount="indefinite"/></circle>
|
|
<circle class="map-dot" cx="305" cy="220" r="5"/>
|
|
<text class="map-city-label" x="318" y="224">Kolkata</text>
|
|
|
|
<!-- Mumbai (West coast) -->
|
|
<circle class="map-dot-pulse" cx="135" cy="265" r="10"><animate attributeName="r" values="6;14;6" dur="2.3s" repeatCount="indefinite"/><animate attributeName="opacity" values="0.5;0.1;0.5" dur="2.3s" repeatCount="indefinite"/></circle>
|
|
<circle class="map-dot" cx="135" cy="265" r="5"/>
|
|
<text class="map-city-label" x="73" y="269">Mumbai</text>
|
|
|
|
<!-- Pune -->
|
|
<circle class="map-dot-pulse" cx="158" cy="280" r="10"><animate attributeName="r" values="6;14;6" dur="2.6s" repeatCount="indefinite"/><animate attributeName="opacity" values="0.5;0.1;0.5" dur="2.6s" repeatCount="indefinite"/></circle>
|
|
<circle class="map-dot" cx="158" cy="280" r="5"/>
|
|
<text class="map-city-label" x="171" y="284">Pune</text>
|
|
|
|
<!-- Hyderabad (Central south) -->
|
|
<circle class="map-dot-pulse" cx="195" cy="305" r="10"><animate attributeName="r" values="6;14;6" dur="1.9s" repeatCount="indefinite"/><animate attributeName="opacity" values="0.5;0.1;0.5" dur="1.9s" repeatCount="indefinite"/></circle>
|
|
<circle class="map-dot" cx="195" cy="305" r="5"/>
|
|
<text class="map-city-label" x="208" y="309">Hyderabad</text>
|
|
|
|
<!-- Bengaluru -->
|
|
<circle class="map-dot-pulse" cx="172" cy="375" r="10"><animate attributeName="r" values="6;14;6" dur="1.8s" repeatCount="indefinite"/><animate attributeName="opacity" values="0.5;0.1;0.5" dur="1.8s" repeatCount="indefinite"/></circle>
|
|
<circle class="map-dot" cx="172" cy="375" r="5"/>
|
|
<text class="map-city-label" x="103" y="379">Bengaluru</text>
|
|
|
|
<!-- Chennai (East coast south) -->
|
|
<circle class="map-dot-pulse" cx="225" cy="385" r="10"><animate attributeName="r" values="6;14;6" dur="2.1s" repeatCount="indefinite"/><animate attributeName="opacity" values="0.5;0.1;0.5" dur="2.1s" repeatCount="indefinite"/></circle>
|
|
<circle class="map-dot" cx="225" cy="385" r="5"/>
|
|
<text class="map-city-label" x="238" y="389">Chennai</text>
|
|
|
|
<!-- Coimbatore -->
|
|
<circle class="map-dot-pulse" cx="183" cy="415" r="10"><animate attributeName="r" values="6;14;6" dur="2.3s" repeatCount="indefinite"/><animate attributeName="opacity" values="0.5;0.1;0.5" dur="2.3s" repeatCount="indefinite"/></circle>
|
|
<circle class="map-dot" cx="183" cy="415" r="5"/>
|
|
<text class="map-city-label" x="196" y="419">Coimbatore</text>
|
|
|
|
<!-- Kochi (Kerala) -->
|
|
<circle class="map-dot-pulse" cx="167" cy="430" r="10"><animate attributeName="r" values="6;14;6" dur="2.2s" repeatCount="indefinite"/><animate attributeName="opacity" values="0.5;0.1;0.5" dur="2.2s" repeatCount="indefinite"/></circle>
|
|
<circle class="map-dot" cx="167" cy="430" r="5"/>
|
|
<text class="map-city-label" x="105" y="434">Kochi</text>
|
|
</svg>
|
|
</div>
|
|
|
|
<div class="map-stats">
|
|
<div class="map-stat"><div class="map-stat-val">28</div><div class="map-stat-lbl">Cities</div></div>
|
|
<div class="map-stat"><div class="map-stat-val">42</div><div class="map-stat-lbl">Lawyers</div></div>
|
|
<div class="map-stat"><div class="map-stat-val">₹0</div><div class="map-stat-lbl">Always</div></div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
<!-- EVENTS -->
|
|
<section class="events-section" id="events">
|
|
<div class="container">
|
|
<div class="events-header reveal">
|
|
<div>
|
|
<div class="section-eyebrow">Upcoming sessions</div>
|
|
<h2 class="section-title">Free community <em>events.</em></h2>
|
|
<p class="section-intro" style="margin-top:20px;">We host live Q&As, SOP workshops, and campus meetups — across India and Germany. All free. All run by current students.</p>
|
|
</div>
|
|
<div class="events-nav">
|
|
<button class="ev-tag on">All</button>
|
|
<button class="ev-tag">India</button>
|
|
<button class="ev-tag">Germany</button>
|
|
<button class="ev-tag">Online</button>
|
|
</div>
|
|
</div>
|
|
<div class="events-grid">
|
|
<div class="event-card reveal rd1">
|
|
<div class="event-img">
|
|
<div class="event-date"><div class="event-date-day">03</div><div class="event-date-mo">May</div></div>
|
|
<div class="event-tag">● Online · Q&A</div>
|
|
</div>
|
|
<div class="event-body">
|
|
<div class="event-city">Online · 18:30 IST</div>
|
|
<h3 class="event-h">Winter 2026 intake — live application clinic</h3>
|
|
<p class="event-p">Four LTA mentors from TUM, RWTH, FU Berlin & TU Dresden answer live SOP and shortlisting questions.</p>
|
|
<div class="event-meta"><span>Free · Open</span><span class="rsvp">RSVP →</span></div>
|
|
</div>
|
|
</div>
|
|
<div class="event-card reveal rd2">
|
|
<div class="event-img event-img-2">
|
|
<div class="event-date"><div class="event-date-day">11</div><div class="event-date-mo">May</div></div>
|
|
<div class="event-tag">● Bengaluru</div>
|
|
</div>
|
|
<div class="event-body">
|
|
<div class="event-city">Bengaluru · Indiranagar</div>
|
|
<h3 class="event-h">APS interview prep — in-person intensive</h3>
|
|
<p class="event-p">Four hours, mock interviews, document review. Limited to 25 students. Refreshments on us.</p>
|
|
<div class="event-meta"><span>₹499 · 9 seats left</span><span class="rsvp">Book →</span></div>
|
|
</div>
|
|
</div>
|
|
<div class="event-card reveal rd3">
|
|
<div class="event-img event-img-3">
|
|
<div class="event-date"><div class="event-date-day">24</div><div class="event-date-mo">May</div></div>
|
|
<div class="event-tag">● Munich</div>
|
|
</div>
|
|
<div class="event-body">
|
|
<div class="event-city">Munich · Englischer Garten</div>
|
|
<h3 class="event-h">LTA summer meetup — new admits & alumni</h3>
|
|
<p class="event-p">Meet your future classmates before you land. Open to anyone with an admit letter for Winter 2026.</p>
|
|
<div class="event-meta"><span>Free · Open</span><span class="rsvp">RSVP →</span></div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
<!-- TEAM (Careloop-style with founder spotlight) -->
|
|
<section class="team-section" id="team">
|
|
<div class="container">
|
|
<div class="team-header reveal">
|
|
<div class="section-eyebrow center">The people behind LTA</div>
|
|
<h2 class="section-title">Built by <em>students.</em> Run by students.</h2>
|
|
<p class="section-intro">We're not ex-bankers or career consultants. We're people who moved to Germany, got burned by the system, and decided to build the community we wish we'd had.</p>
|
|
</div>
|
|
|
|
<!-- FOUNDER SPOTLIGHT -->
|
|
<div class="founder-block reveal">
|
|
<div class="founder-photo">
|
|
<div class="fp-initials">JB</div>
|
|
<svg class="fp-orbit" viewBox="0 0 200 200" preserveAspectRatio="none">
|
|
<circle cx="100" cy="100" r="90" fill="none" stroke="rgba(255,255,255,0.15)" stroke-width="0.5" stroke-dasharray="3 4"/>
|
|
<circle cx="100" cy="100" r="70" fill="none" stroke="rgba(255,255,255,0.1)" stroke-width="0.5" stroke-dasharray="2 6"/>
|
|
</svg>
|
|
</div>
|
|
<div class="founder-info">
|
|
<div class="founder-tag">Founder · Letters to Abroad</div>
|
|
<h3 class="founder-name">Joyel V <em>Boban</em></h3>
|
|
<div class="founder-role">M.Sc. · Uni Duisburg-Essen · RFA Augsburg</div>
|
|
<p class="founder-bio">Joyel founded LTA in 2021 after his own move from Kerala to Germany. What started as a WhatsApp group of friends helping the next batch of applicants became a 500-student community. Today he splits his time between propulsion engineering at Rocket Factory Augsburg and building the platform he wishes had existed when he first applied.</p>
|
|
<p class="founder-quote">"The biggest scam in this industry is convincing students they need a stranger in a suit to find them. They don't. They need someone who walked the road last year — and that's all we are."</p>
|
|
<div class="founder-meta">
|
|
<div class="founder-meta-item"><strong>2021</strong>Founded LTA</div>
|
|
<div class="founder-meta-item"><strong>500+</strong>Students placed</div>
|
|
<div class="founder-meta-item"><strong>Regensburg</strong>Headquartered in</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- MEET OUR TEAM -->
|
|
<div class="meet-team-header reveal">
|
|
<div class="section-eyebrow center">Meet our team</div>
|
|
<h3 class="meet-team-title">The people <em>behind every letter.</em></h3>
|
|
<p class="meet-team-intro">Four department heads keeping LTA running across India and Germany — every one of them, an ex-applicant first.</p>
|
|
</div>
|
|
|
|
<div class="team-grid-leads reveal">
|
|
<div class="team-lead-card">
|
|
<div class="team-lead-photo p2">
|
|
<span class="tlp-initial">A</span>
|
|
<div class="tlp-orb tlp-o1"></div>
|
|
<div class="tlp-orb tlp-o2"></div>
|
|
</div>
|
|
<div class="team-lead-body">
|
|
<div class="team-lead-name">Ann Mariya Jaisan</div>
|
|
<div class="team-lead-role">Media Team Head</div>
|
|
<div class="team-lead-desc">Leads LTA's content, Instagram, and outbound storytelling — every reel and case study you've seen lives in her head first.</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="team-lead-card">
|
|
<div class="team-lead-photo p3">
|
|
<span class="tlp-initial">J</span>
|
|
<div class="tlp-orb tlp-o1"></div>
|
|
<div class="tlp-orb tlp-o2"></div>
|
|
</div>
|
|
<div class="team-lead-body">
|
|
<div class="team-lead-name">Jisha Nelson</div>
|
|
<div class="team-lead-role">Applications Team Lead</div>
|
|
<div class="team-lead-desc">Owns the application pipeline end-to-end. SOPs, LORs, deadlines, uni-assist — if it has a stamp on it, Jisha's signed off.</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="team-lead-card">
|
|
<div class="team-lead-photo p4">
|
|
<span class="tlp-initial">K</span>
|
|
<div class="tlp-orb tlp-o1"></div>
|
|
<div class="tlp-orb tlp-o2"></div>
|
|
</div>
|
|
<div class="team-lead-body">
|
|
<div class="team-lead-name">Karishma Jangide</div>
|
|
<div class="team-lead-role">Sales & Business Development Head</div>
|
|
<div class="team-lead-desc">Runs LTA's growth and partnerships. Builds the bridges between students, universities, and hiring partners across India and Germany.</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="team-lead-card">
|
|
<div class="team-lead-photo p5">
|
|
<span class="tlp-initial">A</span>
|
|
<div class="tlp-orb tlp-o1"></div>
|
|
<div class="tlp-orb tlp-o2"></div>
|
|
</div>
|
|
<div class="team-lead-body">
|
|
<div class="team-lead-name">Atheena Fathima</div>
|
|
<div class="team-lead-role">Operations Head</div>
|
|
<div class="team-lead-desc">Keeps the engine running. Process, mentor onboarding, legal aid coordination, and every system that lets the rest of us actually do our jobs.</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="team-cta reveal">
|
|
<h4>Want to mentor? We'd love to have you.</h4>
|
|
<p>If you're a current student in a German university and you remember what it felt like to apply from home — come help someone else do it.</p>
|
|
<a href="#" class="btn btn-ghost"><span>Become a mentor</span> <svg class="arrow" viewBox="0 0 16 16" fill="none"><path d="M1 8h14M9 2l6 6-6 6" stroke="currentColor" stroke-width="1.5"/></svg></a>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
<!-- PARTNERS -->
|
|
<section class="partners-section" id="partner">
|
|
<div class="container">
|
|
<div class="partners-header reveal">
|
|
<div class="section-eyebrow center">Partner with LTA</div>
|
|
<h2 class="section-title">Work with us <em>directly.</em></h2>
|
|
<p class="section-intro">Whether you're a university admissions team or a German company hiring international talent — let's build something together.</p>
|
|
</div>
|
|
|
|
<!-- Partner logo strip -->
|
|
<div class="partner-logos-strip reveal">
|
|
<div class="pls-label">Already partnered with</div>
|
|
<div class="pls-logos">
|
|
<div class="pls-logo">BMW</div>
|
|
<div class="pls-logo">SAP</div>
|
|
<div class="pls-logo">Siemens</div>
|
|
<div class="pls-logo">Bosch</div>
|
|
<div class="pls-logo">RFA</div>
|
|
<div class="pls-logo">DAAD</div>
|
|
<div class="pls-logo">+34 more</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Main partner cards -->
|
|
<div class="partners-split">
|
|
<!-- UNIVERSITIES -->
|
|
<div class="partners-block reveal rd1">
|
|
<div class="pb-num">01</div>
|
|
<div class="pb-icon">
|
|
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.6">
|
|
<path d="M3 10l9-6 9 6-9 6-9-6z"/>
|
|
<path d="M6 12v5c0 1 3 2 6 2s6-1 6-2v-5"/>
|
|
<path d="M21 10v6"/>
|
|
</svg>
|
|
</div>
|
|
<div class="p-tag">For universities</div>
|
|
<h3>Admissions teams, <em>let's talk.</em></h3>
|
|
<p>We send well-prepared, well-informed applicants to German universities every semester. If your admissions team wants direct access to high-quality international candidates — we're your channel.</p>
|
|
<ul class="pb-features">
|
|
<li>
|
|
<svg viewBox="0 0 16 16" fill="none" stroke="var(--violet)" stroke-width="2"><path d="M2 8l4 4 8-8"/></svg>
|
|
Pre-screened applicant pipeline
|
|
</li>
|
|
<li>
|
|
<svg viewBox="0 0 16 16" fill="none" stroke="var(--violet)" stroke-width="2"><path d="M2 8l4 4 8-8"/></svg>
|
|
Joint info sessions & webinars
|
|
</li>
|
|
<li>
|
|
<svg viewBox="0 0 16 16" fill="none" stroke="var(--violet)" stroke-width="2"><path d="M2 8l4 4 8-8"/></svg>
|
|
Programme-fit data & reporting
|
|
</li>
|
|
</ul>
|
|
<a href="#" class="partners-link">Partner with universities <svg class="arrow" width="14" height="14" viewBox="0 0 16 16" fill="none"><path d="M1 8h14M9 2l6 6-6 6" stroke="currentColor" stroke-width="1.5"/></svg></a>
|
|
</div>
|
|
|
|
<!-- COMPANIES -->
|
|
<div class="partners-block partners-block-dark reveal rd2">
|
|
<div class="pb-num">02</div>
|
|
<div class="pb-icon">
|
|
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.6">
|
|
<rect x="3" y="7" width="18" height="13" rx="2"/>
|
|
<path d="M8 7V5a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2"/>
|
|
<path d="M3 13h18"/>
|
|
</svg>
|
|
</div>
|
|
<div class="p-tag">For companies</div>
|
|
<h3>Hiring international <em>talent in Germany?</em></h3>
|
|
<p>Our ALPHA graduates land at BMW, SAP, Siemens and Bosch — because we only partner with companies that actually hire. Hire from our pipeline, or run a talk for our next cohort.</p>
|
|
<ul class="pb-features">
|
|
<li>
|
|
<svg viewBox="0 0 16 16" fill="none" stroke="var(--mustard)" stroke-width="2"><path d="M2 8l4 4 8-8"/></svg>
|
|
Werkstudent & thesis pipeline
|
|
</li>
|
|
<li>
|
|
<svg viewBox="0 0 16 16" fill="none" stroke="var(--mustard)" stroke-width="2"><path d="M2 8l4 4 8-8"/></svg>
|
|
ALPHA cohort talks & workshops
|
|
</li>
|
|
<li>
|
|
<svg viewBox="0 0 16 16" fill="none" stroke="var(--mustard)" stroke-width="2"><path d="M2 8l4 4 8-8"/></svg>
|
|
Pre-screened, peer-vetted candidates
|
|
</li>
|
|
</ul>
|
|
<a href="#" class="partners-link partners-link-light">Partner for hiring <svg class="arrow" width="14" height="14" viewBox="0 0 16 16" fill="none"><path d="M1 8h14M9 2l6 6-6 6" stroke="currentColor" stroke-width="1.5"/></svg></a>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Bottom collab callout -->
|
|
<div class="partners-callout reveal">
|
|
<div class="pc-left">
|
|
<div class="pc-eyebrow">Other ways to collaborate</div>
|
|
<div class="pc-text">Brand sponsorships · podcast guest spots · campus ambassador programmes · joint research</div>
|
|
</div>
|
|
<a href="mailto:partners@letterstoabroad.com" class="pc-link">
|
|
partners@letterstoabroad.com
|
|
<svg class="arrow" viewBox="0 0 16 16" fill="none"><path d="M1 8h14M9 2l6 6-6 6" stroke="currentColor" stroke-width="1.5"/></svg>
|
|
</a>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
<!-- CTA -->
|
|
<section class="launch-section" id="start">
|
|
<div class="container reveal">
|
|
<div class="launch-eyebrow">
|
|
<span class="dot"></span>
|
|
<span>Winter '26 intake · Now open</span>
|
|
</div>
|
|
<h1 class="launch-title">Your next <em>letter.</em></h1>
|
|
<p class="launch-sub">Drop your email. Get a free, honest profile evaluation from a current LTA mentor within 48 hours — no sales pitch.</p>
|
|
<div class="launch-form">
|
|
<div class="launch-input-row">
|
|
<input type="email" class="launch-input" placeholder="your@email.com">
|
|
<button class="btn btn-primary">
|
|
<span>Get evaluation</span>
|
|
<svg class="arrow" viewBox="0 0 16 16" fill="none"><path d="M1 8h14M9 2l6 6-6 6" stroke="currentColor" stroke-width="1.5"/></svg>
|
|
</button>
|
|
</div>
|
|
<p class="launch-form-note">Or WhatsApp us directly · +49 176 8790 4315</p>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
<!-- FOOTER -->
|
|
<footer>
|
|
<div class="footer-newsletter">
|
|
<div class="fn-left">
|
|
<h5>The Letters weekly digest</h5>
|
|
<p>Two links, one tip, no spam. Admissions news, deadline alerts, and real student stories every Thursday.</p>
|
|
</div>
|
|
<div class="fn-right">
|
|
<input type="email" class="fn-input" placeholder="your@email.com">
|
|
<button class="fn-btn">Subscribe</button>
|
|
</div>
|
|
</div>
|
|
<div class="footer-top">
|
|
<div class="footer-brand">
|
|
<span class="logo">Letters<em>·</em>to<em>·</em>Abroad</span>
|
|
<p>A student community helping international students get into German universities and careers. Built in Regensburg, run worldwide.</p>
|
|
<div class="footer-coord">49.01°N · 12.10°E · Regensburg, DE</div>
|
|
<div class="footer-social">
|
|
<a href="https://instagram.com/letterstoabroad_" aria-label="Instagram"><svg viewBox="0 0 24 24"><path d="M12 2.163c3.204 0 3.584.012 4.85.07 3.252.148 4.771 1.691 4.919 4.919.058 1.265.069 1.645.069 4.849 0 3.205-.012 3.584-.069 4.849-.149 3.225-1.664 4.771-4.919 4.919-1.266.058-1.644.07-4.85.07-3.204 0-3.584-.012-4.849-.07-3.26-.149-4.771-1.699-4.919-4.92-.058-1.265-.07-1.644-.07-4.849 0-3.204.013-3.583.07-4.849.149-3.227 1.664-4.771 4.919-4.919 1.266-.057 1.645-.069 4.849-.069zm0-2.163c-3.259 0-3.667.014-4.947.072-4.358.2-6.78 2.618-6.98 6.98C.014 8.333 0 8.74 0 12s.014 3.668.072 4.948c.2 4.358 2.618 6.78 6.98 6.98 1.281.058 1.689.072 4.948.072 3.259 0 3.668-.014 4.948-.072 4.354-.2 6.782-2.618 6.979-6.98.059-1.28.073-1.689.073-4.948 0-3.26-.014-3.667-.072-4.947-.196-4.354-2.617-6.78-6.979-6.98C15.668.014 15.259 0 12 0zm0 5.838a6.162 6.162 0 1 0 0 12.324 6.162 6.162 0 0 0 0-12.324zM12 16a4 4 0 1 1 0-8 4 4 0 0 1 0 8zm6.406-11.845a1.44 1.44 0 1 0 0 2.881 1.44 1.44 0 0 0 0-2.881z"/></svg></a>
|
|
<a href="https://linkedin.com" aria-label="LinkedIn"><svg viewBox="0 0 24 24"><path d="M20.447 20.452h-3.554v-5.569c0-1.328-.027-3.037-1.852-3.037-1.853 0-2.136 1.445-2.136 2.939v5.667H9.351V9h3.414v1.561h.046c.477-.9 1.637-1.85 3.37-1.85 3.601 0 4.267 2.37 4.267 5.455v6.286zM5.337 7.433a2.062 2.062 0 0 1-2.063-2.065 2.063 2.063 0 1 1 2.063 2.065zm1.782 13.019H3.555V9h3.564v11.452zM22.225 0H1.771C.792 0 0 .774 0 1.729v20.542C0 23.227.792 24 1.771 24h20.451C23.2 24 24 23.227 24 22.271V1.729C24 .774 23.2 0 22.222 0h.003z"/></svg></a>
|
|
<a href="https://wa.me/4917687904315" aria-label="WhatsApp"><svg viewBox="0 0 24 24"><path d="M17.472 14.382c-.297-.149-1.758-.867-2.03-.967-.273-.099-.471-.148-.67.15-.197.297-.767.966-.94 1.164-.173.199-.347.223-.644.075-.297-.15-1.255-.463-2.39-1.475-.883-.788-1.48-1.761-1.653-2.059-.173-.297-.018-.458.13-.606.134-.133.298-.347.446-.52.149-.174.198-.298.298-.497.099-.198.05-.371-.025-.52-.075-.149-.669-1.612-.916-2.207-.242-.579-.487-.5-.669-.51-.173-.008-.371-.01-.57-.01-.198 0-.52.074-.792.372-.272.297-1.04 1.016-1.04 2.479 0 1.462 1.065 2.875 1.213 3.074.149.198 2.096 3.2 5.077 4.487.709.306 1.262.489 1.694.625.712.227 1.36.195 1.871.118.571-.085 1.758-.719 2.006-1.413.248-.694.248-1.289.173-1.413-.074-.124-.272-.198-.57-.347m-5.421 7.403h-.004a9.87 9.87 0 0 1-5.031-1.378l-.361-.214-3.741.982.998-3.648-.235-.374a9.86 9.86 0 0 1-1.51-5.26c.001-5.45 4.436-9.884 9.888-9.884 2.64 0 5.122 1.03 6.988 2.898a9.825 9.825 0 0 1 2.893 6.994c-.003 5.45-4.437 9.884-9.885 9.884m8.413-18.297A11.815 11.815 0 0 0 12.05 0C5.495 0 .16 5.335.157 11.892c0 2.096.547 4.142 1.588 5.945L.057 24l6.305-1.654a11.882 11.882 0 0 0 5.683 1.448h.005c6.554 0 11.89-5.335 11.893-11.893a11.821 11.821 0 0 0-3.48-8.413Z"/></svg></a>
|
|
</div>
|
|
</div>
|
|
<div class="footer-col">
|
|
<h4>Get started</h4>
|
|
<ul>
|
|
<li><a href="#start">Free evaluation</a></li>
|
|
<li><a href="#how">How it works</a></li>
|
|
<li><a href="#packages">Packages</a></li>
|
|
<li><a href="#tools">Free tools</a></li>
|
|
</ul>
|
|
</div>
|
|
<div class="footer-col">
|
|
<h4>Services</h4>
|
|
<ul>
|
|
<li><a href="#services">Shortlisting</a></li>
|
|
<li><a href="#services">SOP & LOR</a></li>
|
|
<li><a href="#services">APS support</a></li>
|
|
<li><a href="#alpha">ALPHA Bootcamp</a></li>
|
|
</ul>
|
|
</div>
|
|
<div class="footer-col">
|
|
<h4>Community</h4>
|
|
<ul>
|
|
<li><a href="#team">Meet the team</a></li>
|
|
<li><a href="#cases">Case studies</a></li>
|
|
<li><a href="#legal">Legal aid network</a></li>
|
|
<li><a href="#events">Events</a></li>
|
|
<li><a href="#partner">Partner with us</a></li>
|
|
</ul>
|
|
</div>
|
|
<div class="footer-col">
|
|
<h4>Contact & legal</h4>
|
|
<ul>
|
|
<li><a href="mailto:info@letterstoabroad.com">info@letterstoabroad.com</a></li>
|
|
<li><a href="https://wa.me/4917687904315">WhatsApp</a></li>
|
|
<li><a href="#">Terms</a></li>
|
|
<li><a href="#">Privacy</a></li>
|
|
<li><a href="#">Imprint</a></li>
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
<div class="footer-bottom">
|
|
<div>© 2026 Auslandsbriefe Pvt. Ltd.</div>
|
|
<div>Made with care in Regensburg · Student-built, student-run</div>
|
|
</div>
|
|
</footer>
|
|
|
|
<script src="https://cdnjs.cloudflare.com/ajax/libs/three.js/r128/three.min.js"></script>
|
|
<script>
|
|
/* BOOT */
|
|
setTimeout(() => document.getElementById('boot').classList.add('done'), 1200);
|
|
|
|
/* ============== HERO 3D — FLOATING ENVELOPES (REFINED) ============== */
|
|
(function(){
|
|
const canvas = document.getElementById('hero-3d');
|
|
if (!canvas) return;
|
|
const scene = new THREE.Scene();
|
|
const camera = new THREE.PerspectiveCamera(40, 1, 0.1, 100);
|
|
camera.position.z = 16;
|
|
const renderer = new THREE.WebGLRenderer({ canvas, antialias: true, alpha: true });
|
|
renderer.setPixelRatio(Math.min(devicePixelRatio, 2));
|
|
|
|
function resize(){
|
|
const w = innerWidth;
|
|
const h = document.querySelector('.hero').offsetHeight;
|
|
renderer.setSize(w, h);
|
|
camera.aspect = w / h;
|
|
camera.updateProjectionMatrix();
|
|
}
|
|
resize();
|
|
addEventListener('resize', resize);
|
|
|
|
// Lights
|
|
scene.add(new THREE.AmbientLight(0xffffff, 0.5));
|
|
const violetLight = new THREE.PointLight(0x7B5AE8, 2, 30);
|
|
violetLight.position.set(-6, 4, 5);
|
|
scene.add(violetLight);
|
|
const mustardLight = new THREE.PointLight(0xD4A748, 1.5, 25);
|
|
mustardLight.position.set(6, -3, 4);
|
|
scene.add(mustardLight);
|
|
|
|
// Build envelope
|
|
function makeEnvelope(){
|
|
const g = new THREE.Group();
|
|
const paper = new THREE.MeshStandardMaterial({
|
|
color: 0xFAF5E8, metalness: 0.05, roughness: 0.6, side: THREE.DoubleSide
|
|
});
|
|
const accent = new THREE.MeshStandardMaterial({
|
|
color: 0x7B5AE8, metalness: 0.3, roughness: 0.4,
|
|
emissive: 0x7B5AE8, emissiveIntensity: 0.25
|
|
});
|
|
const body = new THREE.Mesh(new THREE.BoxGeometry(1.5, 1.0, 0.04), paper);
|
|
g.add(body);
|
|
const flapShape = new THREE.Shape();
|
|
flapShape.moveTo(-0.75, 0);
|
|
flapShape.lineTo(0.75, 0);
|
|
flapShape.lineTo(0, -0.5);
|
|
flapShape.lineTo(-0.75, 0);
|
|
const flap = new THREE.Mesh(
|
|
new THREE.ExtrudeGeometry(flapShape, { depth: 0.02, bevelEnabled: false }), paper
|
|
);
|
|
flap.position.set(0, 0.5, 0.025);
|
|
flap.rotation.x = -0.3;
|
|
g.add(flap);
|
|
const seal = new THREE.Mesh(new THREE.CircleGeometry(0.11, 24), accent);
|
|
seal.position.set(0, 0.05, 0.03);
|
|
g.add(seal);
|
|
return g;
|
|
}
|
|
|
|
const envs = [];
|
|
const layout = [
|
|
{ x: -7, y: 3, z: -2 }, { x: 7, y: 2, z: -1 },
|
|
{ x: -8, y: -2, z: -3 }, { x: 8, y: -3, z: 0 },
|
|
{ x: -5, y: -4, z: -4 }, { x: 6, y: 4, z: -3 },
|
|
{ x: -10, y: 1, z: -5 }, { x: 10, y: -1, z: -4 },
|
|
];
|
|
layout.forEach(p => {
|
|
const e = makeEnvelope();
|
|
e.position.set(p.x, p.y, p.z);
|
|
e.rotation.set(Math.random() * Math.PI, Math.random() * Math.PI, Math.random() * 0.4 - 0.2);
|
|
e.userData = {
|
|
rotS: (Math.random() * 0.4 + 0.15) * (Math.random() > 0.5 ? 1 : -1),
|
|
flS: Math.random() * 0.6 + 0.3,
|
|
flA: Math.random() * 0.3 + 0.15,
|
|
iy: p.y,
|
|
};
|
|
scene.add(e);
|
|
envs.push(e);
|
|
});
|
|
|
|
// Particles
|
|
const pCount = 120;
|
|
const pGeo = new THREE.BufferGeometry();
|
|
const pPos = new Float32Array(pCount * 3);
|
|
for (let i = 0; i < pCount * 3; i++){ pPos[i] = (Math.random() - 0.5) * 30; }
|
|
pGeo.setAttribute('position', new THREE.BufferAttribute(pPos, 3));
|
|
const pMat = new THREE.PointsMaterial({
|
|
size: 0.025, color: 0x7B5AE8, transparent: true, opacity: 0.5,
|
|
blending: THREE.AdditiveBlending
|
|
});
|
|
const particles = new THREE.Points(pGeo, pMat);
|
|
scene.add(particles);
|
|
|
|
// Mouse parallax
|
|
let pmx = 0, pmy = 0, ptx = 0, pty = 0;
|
|
addEventListener('mousemove', e => {
|
|
ptx = (e.clientX / innerWidth - 0.5) * 2;
|
|
pty = (e.clientY / innerHeight - 0.5) * 2;
|
|
});
|
|
|
|
const clock = new THREE.Clock();
|
|
function render(){
|
|
const t = clock.getElapsedTime();
|
|
pmx += (ptx - pmx) * 0.04;
|
|
pmy += (pty - pmy) * 0.04;
|
|
camera.position.x = pmx * 0.6;
|
|
camera.position.y = -pmy * 0.4;
|
|
camera.lookAt(0, 0, 0);
|
|
|
|
envs.forEach((e, i) => {
|
|
e.rotation.y += 0.003 * e.userData.rotS;
|
|
e.rotation.x += 0.001 * e.userData.rotS;
|
|
e.position.y = e.userData.iy + Math.sin(t * e.userData.flS + i) * e.userData.flA;
|
|
});
|
|
particles.rotation.y = t * 0.015;
|
|
|
|
renderer.render(scene, camera);
|
|
requestAnimationFrame(render);
|
|
}
|
|
render();
|
|
})();
|
|
|
|
/* STEP CARD 3D TILT */
|
|
document.querySelectorAll('.step-card').forEach(card => {
|
|
card.addEventListener('mousemove', e => {
|
|
const r = card.getBoundingClientRect();
|
|
const px = (e.clientX - r.left) / r.width;
|
|
const py = (e.clientY - r.top) / r.height;
|
|
const rx = (py - 0.5) * -5;
|
|
const ry = (px - 0.5) * 5;
|
|
card.style.transform = `perspective(1000px) rotateX(${rx}deg) rotateY(${ry}deg)`;
|
|
card.style.setProperty('--mx', (px * 100) + '%');
|
|
card.style.setProperty('--my', (py * 100) + '%');
|
|
});
|
|
card.addEventListener('mouseleave', () => { card.style.transform = ''; });
|
|
});
|
|
|
|
/* SCROLL REVEAL */
|
|
(function(){
|
|
const io = new IntersectionObserver(entries => {
|
|
entries.forEach(e => {
|
|
if (e.isIntersecting){
|
|
e.target.classList.add('in');
|
|
io.unobserve(e.target);
|
|
}
|
|
});
|
|
}, { threshold: 0.12 });
|
|
document.querySelectorAll('.reveal').forEach(el => io.observe(el));
|
|
})();
|
|
|
|
/* TABS */
|
|
document.querySelectorAll('.services-tab').forEach(tab => {
|
|
tab.addEventListener('click', () => {
|
|
document.querySelectorAll('.services-tab').forEach(t => t.classList.remove('active'));
|
|
tab.classList.add('active');
|
|
});
|
|
});
|
|
document.querySelectorAll('.ev-tag').forEach(tag => {
|
|
tag.addEventListener('click', () => {
|
|
document.querySelectorAll('.ev-tag').forEach(t => t.classList.remove('on'));
|
|
tag.classList.add('on');
|
|
});
|
|
});
|
|
</script>
|
|
</body>
|
|
</html>
|