:root { --wine:#651321; --wine-dark:#360910; --gold:#f6bb45; --cream:#fff7e8; --paper:#fffdf8; --ink:#20181a; --muted:#716568; --line:#e7dad2; --navy:#122c3d; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; overflow-x:hidden; background:var(--paper); color:var(--ink); font:400 1rem/1.65 "DM Sans",sans-serif; }
img { display:block; max-width:100%; }
a { color:inherit; }
.skip-link { position:fixed; z-index:100; top:-5rem; left:1rem; padding:.8rem 1rem; background:white; color:var(--wine); }
.skip-link:focus { top:1rem; }
.site-header { position:sticky; z-index:50; top:0; background:rgba(255,253,248,.92); border-bottom:1px solid rgba(101,19,33,.09); backdrop-filter:blur(18px); }
.nav-wrap { width:min(1320px,calc(100% - 48px)); min-height:84px; margin:auto; display:flex; align-items:center; justify-content:space-between; gap:2rem; }
.brand { display:flex; align-items:center; gap:.85rem; text-decoration:none; }
.school-logo { width:62px; height:62px; flex:0 0 auto; border-radius:50%; background:white url("qtkn-logo.jpeg") center/137% no-repeat; box-shadow:0 3px 12px rgba(101,19,33,.16); }
.brand-copy { line-height:1.15; }
.brand-copy strong { display:block; font-family:"Playfair Display",serif; font-size:1.04rem; }
.brand-copy small { display:block; margin-top:.28rem; color:var(--wine); font:600 .68rem "Noto Sans Tamil",sans-serif; }
nav { display:flex; align-items:center; gap:1.9rem; }
nav a { text-decoration:none; font-size:.92rem; font-weight:600; }
nav>a:not(.nav-button):hover { color:var(--wine); }
.nav-button { padding:.72rem 1.1rem; border-radius:999px; background:var(--wine); color:white; }
.menu-toggle { display:none; border:1px solid var(--line); border-radius:999px; background:white; padding:.55rem .9rem; color:var(--ink); font:600 .9rem "DM Sans",sans-serif; }
.hero { width:min(1420px,100%); min-height:calc(100vh - 84px); margin:auto; display:grid; grid-template-columns:.92fr 1.08fr; background:var(--cream); }
.hero-copy { padding:clamp(4rem,8vw,8rem) clamp(2rem,6vw,7rem); display:flex; flex-direction:column; justify-content:center; position:relative; }
.hero-copy::before { content:"அ"; position:absolute; right:3%; top:2%; color:rgba(101,19,33,.045); font:700 19rem/1 "Noto Sans Tamil",sans-serif; pointer-events:none; }
.overline { margin:0 0 1.2rem; color:var(--wine); text-transform:uppercase; letter-spacing:.16em; font-size:.74rem; font-weight:700; }
.overline.gold { color:var(--gold); }
h1,h2 { margin:0; font-family:"Playfair Display",serif; font-weight:600; line-height:.98; letter-spacing:-.035em; }
h1 { max-width:660px; font-size:clamp(3.6rem,6.1vw,7rem); }
h1 em { color:var(--wine); font-weight:600; }
h2 { font-size:clamp(2.7rem,4.6vw,5.25rem); }
h3 { margin:0; line-height:1.2; }
.tamil-line { margin:1.25rem 0 .75rem; color:var(--wine); font:600 clamp(1.05rem,1.5vw,1.35rem)/1.5 "Noto Sans Tamil",sans-serif; }
.intro { max-width:610px; margin:.5rem 0 0; color:#54474a; font-size:1.08rem; }
.hero-actions { display:flex; align-items:center; flex-wrap:wrap; gap:1.5rem; margin-top:2rem; }
.button { min-height:52px; display:inline-flex; align-items:center; gap:1.4rem; justify-content:center; padding:.8rem 1.25rem; border-radius:3px; text-decoration:none; font-weight:700; transition:transform .2s ease,box-shadow .2s ease; }
.button:hover { transform:translateY(-2px); }
.primary { background:var(--wine); color:white; box-shadow:0 16px 30px rgba(101,19,33,.18); }
.text-link { color:var(--wine); font-weight:700; text-underline-offset:5px; }
.trust-row { margin-top:3.5rem; padding-top:1.4rem; display:grid; grid-template-columns:repeat(3,1fr); border-top:1px solid rgba(101,19,33,.18); }
.trust-row div { padding-right:.7rem; }
.trust-row strong,.trust-row span,.trust-row a { display:block; }
.trust-row strong { font-size:1.05rem; }
.trust-row span { margin-top:.1rem; color:var(--muted); font-size:.78rem; }
.ata-verified { margin-top:.1rem; color:var(--wine); font-size:.78rem; font-weight:600; text-decoration:none; }
.ata-verified:hover { text-decoration:underline; text-underline-offset:3px; }
.hero-visual { position:relative; min-height:700px; background:var(--wine); overflow:hidden; }
.image-frame { position:absolute; inset:0; }
.image-frame::after { content:""; position:absolute; inset:0; background:linear-gradient(180deg,rgba(54,9,16,.05),rgba(54,9,16,.4)); }
.image-frame img { width:100%; height:100%; object-fit:cover; object-position:64% center; }
.location-card { position:absolute; z-index:2; left:2rem; bottom:2rem; max-width:360px; display:flex; align-items:center; gap:.8rem; padding:1rem 1.2rem; background:rgba(255,253,248,.94); box-shadow:0 24px 60px rgba(32,10,14,.2); backdrop-filter:blur(12px); }
.location-card .pin { color:var(--wine); font-size:.7rem; }
.location-card small,.location-card strong { display:block; }
.location-card small { color:var(--muted); }
.tamil-watermark { position:absolute; z-index:2; right:-1rem; bottom:-2.8rem; color:rgba(255,255,255,.15); font:700 clamp(5rem,10vw,9rem) "Noto Sans Tamil",sans-serif; }
.marquee { overflow:hidden; background:var(--wine); color:white; padding:1rem 0; white-space:nowrap; }
.marquee div { width:max-content; min-width:100%; display:flex; justify-content:space-around; align-items:center; gap:2rem; padding:0 2rem; font-size:.79rem; letter-spacing:.18em; font-weight:700; }
.marquee span[lang="ta"] { color:var(--gold); font-family:"Noto Sans Tamil",sans-serif; }
.marquee i { color:var(--gold); font-style:normal; }
.section { width:min(1240px,calc(100% - 48px)); margin:auto; padding:clamp(6rem,10vw,10rem) 0; }
.story { display:grid; grid-template-columns:70px .8fr 1.2fr; gap:clamp(2rem,6vw,6rem); align-items:start; }
.section-number { color:var(--wine); font-family:"Playfair Display",serif; font-size:1.1rem; }
.story-title h2 { max-width:500px; }
.story-body { max-width:650px; padding-top:2.5rem; }
.story-body p { color:var(--muted); }
.story-body .lead { margin-top:0; color:var(--ink); font-size:1.35rem; line-height:1.5; }
.quote { margin-top:2.5rem; padding:1.5rem 0 0 2rem; border-top:1px solid var(--line); color:var(--wine); font:600 1.15rem/1.7 "Noto Sans Tamil",sans-serif; }
.quote span { margin-left:-1.7rem; color:var(--gold); font:700 3rem/0 "Playfair Display",serif; }
.why-tamil { border-top:1px solid var(--line); }
.why-heading { display:grid; grid-template-columns:.55fr 1.15fr .8fr; gap:2.5rem; align-items:end; }
.why-heading .overline { align-self:start; }
.why-heading>p:last-child { margin:0; color:var(--muted); }
.why-facts { margin-top:4rem; display:grid; grid-template-columns:repeat(3,1fr); border-top:1px solid var(--line); border-bottom:1px solid var(--line); }
.why-facts article { min-height:310px; padding:2rem; border-right:1px solid var(--line); }
.why-facts article:first-child { padding-left:0; }
.why-facts article:last-child { border-right:0; }
.fact-number,.fact-symbol { display:block; margin-bottom:3rem; color:var(--wine); font:600 clamp(3.5rem,6vw,6rem)/1 "Playfair Display",serif; }
.fact-symbol { font-family:"Noto Sans Tamil",sans-serif; }
.why-facts h3 { font:600 1.45rem "Playfair Display",serif; }
.why-facts p { color:var(--muted); }
.source-link { display:inline-flex; gap:.8rem; margin-top:1.5rem; color:var(--wine); font-weight:700; text-underline-offset:4px; }
.program { width:100%; padding-inline:max(24px,calc((100% - 1240px)/2)); background:var(--navy); color:white; }
.program-head { display:grid; grid-template-columns:1.15fr .85fr; gap:5rem; align-items:end; }
.program-head>p { max-width:500px; margin:0; color:#bfd0da; font-size:1.07rem; }
.skill-list { margin-top:4rem; border-top:1px solid rgba(255,255,255,.2); }
.skill-list article { display:grid; grid-template-columns:80px 1fr 40px; gap:1rem; align-items:center; padding:1.55rem 0; border-bottom:1px solid rgba(255,255,255,.16); transition:padding .25s ease,color .25s ease; }
.skill-list article:hover { padding-left:1rem; color:var(--gold); }
.skill-no { color:var(--gold); font-family:"Playfair Display",serif; }
.skill-list h3 { font-size:clamp(1.45rem,2.3vw,2.3rem); font-weight:500; }
.skill-list h3 b { margin-left:.8rem; color:#b7c8d2; font:500 .8em "Noto Sans Tamil",sans-serif; }
.skill-list p { margin:.2rem 0 0; color:#aebfc9; }
.arrow { justify-self:end; color:var(--gold); font-size:1.4rem; }
.ata-note { margin-top:4rem; display:grid; grid-template-columns:auto 1fr auto; gap:1.3rem; align-items:center; padding:1.7rem; background:rgba(255,255,255,.07); border:1px solid rgba(255,255,255,.12); }
.ata-badge { display:grid; place-items:center; width:58px; height:58px; border:1px solid var(--gold); color:var(--gold); font-weight:800; }
.ata-note strong { font-size:1.08rem; }
.ata-note p { margin:.25rem 0 0; color:#b8c9d2; }
.ata-note a { color:var(--gold); font-weight:700; }
.ata-resources { display:grid; grid-template-columns:.78fr 1.22fr; gap:clamp(3rem,7vw,7rem); align-items:start; }
.resources-heading { position:sticky; top:130px; }
.resources-heading h2 { font-size:clamp(2.8rem,4.5vw,4.8rem); }
.resources-heading>p:last-child { max-width:440px; color:var(--muted); }
.resource-grid { border-top:1px solid var(--line); }
.resource-grid a { display:grid; grid-template-columns:55px 1fr auto; gap:.8rem; align-items:center; padding:1.55rem 0; border-bottom:1px solid var(--line); text-decoration:none; transition:padding .2s ease,color .2s ease; }
.resource-grid a:hover { padding-left:.8rem; color:var(--wine); }
.resource-grid span { color:var(--wine); font-family:"Playfair Display",serif; }
.resource-grid strong,.resource-grid small { display:block; }
.resource-grid strong { font:600 1.35rem "Playfair Display",serif; }
.resource-grid small { margin-top:.2rem; color:var(--muted); font-size:.83rem; }
.resource-grid b { color:var(--gold); font-size:1.25rem; }
.details { display:grid; grid-template-columns:.9fr 1.1fr; gap:clamp(3rem,8vw,8rem); align-items:center; }
.details-card { position:relative; padding:clamp(2.3rem,4vw,4rem); background:var(--cream); }
.details-card::after { content:""; position:absolute; right:-14px; bottom:-14px; width:100%; height:100%; border-right:14px solid var(--gold); border-bottom:14px solid var(--gold); pointer-events:none; }
.details-card h2 { font-size:clamp(2.8rem,4.5vw,4.8rem); }
.details-card p { color:var(--muted); font-size:1.05rem; }
.details-card .button { margin-top:1rem; }
.details-list { border-top:1px solid var(--line); }
.details-list div { display:flex; justify-content:space-between; gap:2rem; padding:1.25rem 0; border-bottom:1px solid var(--line); }
.details-list span { color:var(--muted); }
.details-list strong { text-align:right; }
.leadership { border-top:1px solid var(--line); }
.leadership-intro { display:grid; grid-template-columns:1fr 1.2fr .8fr; gap:2.5rem; align-items:end; }
.leadership-intro .overline { align-self:start; }
.leadership-intro>p:last-child { margin:0; color:var(--muted); }
.leadership-cards { margin-top:4rem; display:grid; grid-template-columns:repeat(3,1fr); }
.leadership-cards article { min-height:320px; padding:2rem; border:1px solid var(--line); border-right:0; display:flex; flex-direction:column; }
.leadership-cards article:last-child { border-right:1px solid var(--line); }
.leadership-cards .admin-card { background:var(--wine); color:white; border-color:var(--wine); }
.role { margin-bottom:auto; color:var(--wine); text-transform:uppercase; letter-spacing:.14em; font-size:.7rem; font-weight:700; }
.admin-card .role { color:var(--gold); }
.leadership-cards h3 { margin-top:3rem; font:600 1.65rem "Playfair Display",serif; }
.leadership-cards p,.leadership-cards li { color:var(--muted); }
.admin-card p { color:#eedde0; }
.leadership-cards ul { padding-left:1.2rem; }
.contact { min-height:620px; position:relative; overflow:hidden; display:grid; grid-template-columns:.85fr 1.15fr; align-items:center; gap:5rem; padding:clamp(5rem,9vw,9rem) max(24px,calc((100% - 1240px)/2)); background:var(--wine-dark); color:white; }
.contact-tamil { color:rgba(246,187,69,.12); font:700 clamp(6rem,16vw,14rem)/1 "Noto Sans Tamil",sans-serif; white-space:nowrap; transform:rotate(-5deg); }
.contact-copy h2 { max-width:700px; }
.contact-links { margin-top:3rem; display:grid; grid-template-columns:1fr 1fr; gap:2rem; }
.contact-links a { padding-top:1rem; border-top:1px solid rgba(255,255,255,.25); text-decoration:none; }
.contact-links span,.contact-links strong { display:block; }
.contact-links span { color:#c9aeb3; font-size:.8rem; }
.contact-links strong { margin-top:.35rem; }
.contact-links a:hover strong { color:var(--gold); }
footer { min-height:120px; padding:2rem max(24px,calc((100% - 1240px)/2)); display:grid; grid-template-columns:1.3fr 1fr auto; gap:2rem; align-items:center; background:#190408; color:#c6adb2; font-size:.86rem; }
.footer-brand { display:flex; align-items:center; gap:.75rem; }
.footer-logo { width:52px; height:52px; flex:0 0 auto; border-radius:50%; background:white url("qtkn-logo.jpeg") center/137% no-repeat; }
.footer-brand strong,.footer-brand small { display:block; }
.footer-brand strong { color:white; font-family:"Playfair Display",serif; }
.footer-brand small { color:var(--gold); font-family:"Noto Sans Tamil",sans-serif; }
.footer-links { display:flex; flex-wrap:wrap; gap:1rem; }
.footer-links a { color:#e2ced2; font-weight:600; text-decoration:none; }
.footer-links a:hover { color:var(--gold); }
@media(max-width:1020px){.menu-toggle{display:block}nav{display:none;position:absolute;top:75px;left:20px;right:20px;flex-direction:column;align-items:stretch;gap:0;padding:.8rem;background:white;border:1px solid var(--line);box-shadow:0 24px 50px rgba(48,14,20,.16)}nav.open{display:flex}nav a{padding:.85rem}.nav-button{margin-top:.4rem;text-align:center}.hero{grid-template-columns:1fr}.hero-copy{min-height:690px}.hero-visual{min-height:600px}.story{grid-template-columns:50px 1fr}.story-body{grid-column:2;padding-top:0}.why-heading{grid-template-columns:1fr 1fr}.why-heading>p:last-child{grid-column:2}.ata-resources{grid-template-columns:1fr}.resources-heading{position:static}.leadership-intro{grid-template-columns:1fr 1fr}.leadership-intro>p:last-child{grid-column:2}.contact{grid-template-columns:.65fr 1.35fr}}
@media(max-width:740px){.nav-wrap{width:calc(100% - 28px);min-height:74px}.brand-copy strong{font-size:.9rem}.brand-copy small{display:none}.school-logo{width:50px;height:50px}.hero{min-height:auto}.hero-copy{min-height:auto;padding:5rem 1.4rem 4rem}h1{font-size:clamp(3.2rem,16vw,4.8rem)}.trust-row{grid-template-columns:1fr;gap:.8rem}.trust-row div{padding-bottom:.8rem;border-bottom:1px solid rgba(101,19,33,.12)}.hero-visual{min-height:520px}.image-frame img{object-position:68% center}.location-card{left:1rem;right:1rem;bottom:1rem}.marquee div{justify-content:flex-start}.section{width:calc(100% - 28px);padding:5rem 0}.story{grid-template-columns:1fr;gap:1.5rem}.section-number{display:none}.story-body{grid-column:1}.why-heading{grid-template-columns:1fr;gap:1.3rem}.why-heading>p:last-child{grid-column:1}.why-facts{grid-template-columns:1fr}.why-facts article,.why-facts article:first-child{min-height:auto;padding:2rem 0;border-right:0;border-bottom:1px solid var(--line)}.why-facts article:last-child{border-bottom:0}.fact-number,.fact-symbol{margin-bottom:1.5rem}.program{width:100%;padding-inline:1.4rem}.program-head{grid-template-columns:1fr;gap:1.5rem}.skill-list article{grid-template-columns:46px 1fr 24px}.skill-list h3 b{display:block;margin:.3rem 0 0}.skill-list p{font-size:.9rem}.ata-note{grid-template-columns:auto 1fr}.ata-note a{grid-column:2}.ata-resources{grid-template-columns:1fr}.resource-grid a{grid-template-columns:42px 1fr auto}.details{grid-template-columns:1fr}.details-list div{display:grid;gap:.25rem}.details-list strong{text-align:left}.leadership-intro{grid-template-columns:1fr;gap:1.3rem}.leadership-intro>p:last-child{grid-column:1}.leadership-cards{grid-template-columns:1fr}.leadership-cards article,.leadership-cards article:last-child{min-height:260px;border-right:1px solid var(--line);border-bottom:0}.leadership-cards article:last-child{border-bottom:1px solid var(--line)}.contact{min-height:auto;grid-template-columns:1fr;gap:1rem;padding:5rem 1.4rem}.contact-tamil{position:absolute;right:-2rem;top:1rem}.contact-copy{position:relative;z-index:1}.contact-links{grid-template-columns:1fr}footer{grid-template-columns:1fr;gap:1rem}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.button,.skill-list article{transition:none}}

.language-switch { margin-left:auto; flex-shrink:0; padding:.5rem .8rem; border:1px solid var(--wine); border-radius:999px; color:var(--wine); font:600 .9rem/1.5 "Noto Sans Tamil",sans-serif; text-decoration:none; }
html[lang="ta"] body {font-family:"Noto Sans Tamil",sans-serif;line-height:1.9;}
html[lang="ta"] h1,html[lang="ta"] h2,html[lang="ta"] h3,html[lang="ta"] .brand-copy strong,html[lang="ta"] .resource-grid strong,html[lang="ta"] .footer-brand strong {font-family:"Noto Sans Tamil",sans-serif;line-height:1.45;letter-spacing:0;}
html[lang="ta"] h1 {font-size:clamp(2.6rem,4.4vw,4.6rem);}
html[lang="ta"] h2 {font-size:clamp(2rem,3vw,3.4rem);}
html[lang="ta"] .overline,html[lang="ta"] .role {letter-spacing:0;font-size:.9rem;line-height:1.8;}
html[lang="ta"] .brand-copy strong {font-size:1rem;}
html[lang="ta"] nav {gap:1rem;}
html[lang="ta"] nav a {font-size:.86rem;}
html[lang="ta"] .hero-copy {padding:3.5rem clamp(1.5rem,4vw,4rem);}
html[lang="ta"] .hero-visual {min-height:760px;}
html[lang="ta"] .trust-row {gap:.7rem;}
html[lang="ta"] .trust-row strong {font-size:.9rem;}
html[lang="ta"] .leadership-cards h3 {font-size:1.4rem;}
html[lang="ta"] .details-list strong {min-width:3rem;}
html[lang="ta"] .intro {font-size:1rem;}
@media(min-width:1021px) and (max-width:1250px){.nav-wrap{gap:1rem}nav{gap:1rem}.brand-copy strong{max-width:220px}html[lang="ta"] nav{gap:.7rem}}
@media(max-width:740px){.nav-wrap{gap:.5rem}.brand-copy strong{max-width:170px}.language-switch{font-size:.8rem;padding:.4rem .6rem}.menu-toggle{padding:.4rem .6rem}html[lang="ta"] .brand-copy strong{font-size:.78rem}html[lang="ta"] h1{font-size:2.4rem}html[lang="ta"] .hero-copy{padding:3rem 1.4rem}html[lang="ta"] .hero-visual{min-height:520px}}

@font-face{font-family:"Noto Sans Tamil";src:url("tamil-regular.ttf") format("truetype");font-weight:400;font-display:swap;}

.language-picker{display:flex;flex-wrap:wrap;gap:.35rem;align-items:center;flex-shrink:0;margin-left:auto}
.language-picker .language-switch{margin-left:0;font-size:.8rem;padding:.4rem .6rem;line-height:1.6}
.language-switch[aria-current="page"]{background:var(--wine);color:white}
.nav-wrap{flex-wrap:wrap;gap:1rem;padding-block:.65rem}
html[lang="fr"] nav{gap:1rem}
html[lang="fr"] h1{font-size:clamp(3rem,5vw,5.5rem)}
html[lang="fr"] h2{font-size:clamp(2.5rem,3.8vw,4.4rem)}
@media(min-width:1021px){.nav-wrap nav{width:100%;justify-content:flex-end}}
@media(max-width:1020px){nav{top:100%}}
@media(max-width:740px){.nav-wrap{gap:.6rem}.language-picker{order:3;width:100%;justify-content:center;margin:0}.menu-toggle{margin-left:auto}.language-picker .language-switch{padding:.4rem .75rem;font-size:.9rem}.brand-copy strong{max-width:220px}}