/*
Theme Name: TD. Course Downloader
Theme URI: https://www.tddownload.com
Author: Tahiri Idriss
Author URI: https://www.tddownload.com
Description: One-page marketing theme for the TD. Course Downloader Windows app. Dark, focused landing page with hero, features, platform grid, reviews, pricing, download and FAQ sections. Fully editable in the Customizer (text, links, prices, colours, section on/off), with footer + hero + page widget areas and three menu locations.
Version: 1.4.9
Requires at least: 6.2
Tested up to: 6.6
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: td-course-downloader
Tags: one-page, landing-page, custom-menu, custom-logo, featured-images, translation-ready
*/

:root{
  --bg:#0b1120;
  --bg-2:#0f172a;
  --card:rgba(255,255,255,.045);
  --card-brd:rgba(255,255,255,.09);
  --ink:#eef2f7;
  --ink-dim:#9aa7b8;
  --ink-faint:#6b7789;
  --cyan:#22d3ee;
  --blue:#3b82f6;
  --grad:linear-gradient(135deg,#38bdf8,#3b82f6 55%,#6366f1);
  --radius:16px;
  --maxw:1120px;
  --font:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{font-family:var(--font);background:var(--bg);color:var(--ink);line-height:1.6;-webkit-font-smoothing:antialiased;overflow-x:hidden}
a{color:inherit;text-decoration:none}
img,svg{display:block;max-width:100%}
.wrap{max-width:var(--maxw);margin:0 auto;padding:0 24px}
section{position:relative}
section[id]{scroll-margin-top:84px}
.admin-bar section[id]{scroll-margin-top:116px}
.screen-reader-text{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(1px,1px,1px,1px);white-space:nowrap}
.skip-link{position:absolute;left:-9999px}
.skip-link:focus{left:12px;top:12px;background:var(--card);padding:8px 14px;border-radius:8px;z-index:999}

/* ---------- background glow ---------- */
.bg-fx{position:fixed;inset:0;z-index:-1;overflow:hidden;background:
    radial-gradient(1200px 700px at 78% -10%, rgba(56,189,248,.16), transparent 60%),
    radial-gradient(900px 600px at 10% 0%, rgba(99,102,241,.14), transparent 55%),
    linear-gradient(180deg,#0b1120,#0b1120 40%,#0d1424)}
.bg-fx::after{content:"";position:absolute;inset:0;
  background-image:radial-gradient(rgba(255,255,255,.04) 1px, transparent 1px);
  background-size:44px 44px;-webkit-mask:linear-gradient(180deg,#000,transparent 70%);mask:linear-gradient(180deg,#000,transparent 70%)}

/* ---------- header ---------- */
.site-header{position:sticky;top:0;z-index:50;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);
  background:rgba(11,17,32,.72);border-bottom:1px solid rgba(255,255,255,.06)}
.admin-bar .site-header{top:32px}
.nav{display:flex;align-items:center;gap:28px;height:66px}
.brand{display:flex;align-items:center;gap:11px;font-weight:700;letter-spacing:-.01em;font-size:15px}
.brand .mark{width:30px;height:30px;flex:none}
.brand img{width:30px;height:30px}
.brand .ver{font-size:11px;font-weight:700;color:var(--cyan);border:1px solid rgba(34,211,238,.35);
  padding:1px 6px;border-radius:999px;letter-spacing:.02em}
.nav .links{display:flex;gap:26px;margin-left:auto;font-size:14px;color:var(--ink-dim);list-style:none}
.nav .links a:hover{color:var(--ink)}
.btn{display:inline-flex;align-items:center;gap:8px;font-weight:600;font-size:14px;
  padding:10px 18px;border-radius:10px;border:1px solid transparent;cursor:pointer;transition:.15s;white-space:nowrap}
.btn-primary{background:var(--grad);color:#0a1020;box-shadow:0 8px 24px -8px rgba(59,130,246,.6)}
.btn-primary:hover{filter:brightness(1.07);transform:translateY(-1px)}
.btn-ghost{border-color:var(--card-brd);color:var(--ink);background:var(--card)}
.btn-ghost:hover{border-color:rgba(255,255,255,.25)}
.nav .btn{margin-left:4px}

/* ---------- hero ---------- */
.hero{padding:84px 0 72px;text-align:center}
.pill{display:inline-flex;align-items:center;gap:8px;font-size:12.5px;color:var(--ink-dim);
  border:1px solid var(--card-brd);background:var(--card);padding:6px 14px;border-radius:999px;margin-bottom:26px}
.pill .dot{width:7px;height:7px;border-radius:50%;background:var(--cyan);box-shadow:0 0 10px var(--cyan)}
.hero h1{font-size:clamp(2rem,5vw,3.5rem);line-height:1.15;letter-spacing:-.03em;font-weight:800;
  max-width:24ch;margin:0 auto 20px;text-wrap:balance}
.hero h1 .g{display:block;line-height:1.22;padding-bottom:.08em;
  background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent}
.hero p.sub{font-size:clamp(1rem,2.1vw,1.19rem);color:var(--ink-dim);max-width:52ch;margin:0 auto 34px}
.hero .cta{display:flex;gap:14px;justify-content:center;flex-wrap:wrap}
.hero .btn{padding:13px 24px;font-size:15px}
.hero .fineprint{margin-top:18px;font-size:12.5px;color:var(--ink-faint)}

/* ---------- app mockup ---------- */
.shot{margin:58px auto 0;max-width:860px;border-radius:calc(var(--radius) + 4px);
  border:1px solid var(--card-brd);background:linear-gradient(180deg,#111a2e,#0d1424);
  box-shadow:0 40px 120px -30px rgba(0,0,0,.75), 0 0 0 1px rgba(255,255,255,.04);overflow:hidden}
.shot .bar{display:flex;align-items:center;gap:7px;padding:12px 16px;border-bottom:1px solid rgba(255,255,255,.06);background:rgba(255,255,255,.02)}
.shot .bar i{width:11px;height:11px;border-radius:50%;background:#2a3852;display:block}
.shot .bar span{margin-left:12px;font-size:12px;color:var(--ink-faint)}
.shot .body{padding:26px;display:grid;gap:14px}
.shot .row{display:flex;align-items:center;gap:14px;background:rgba(255,255,255,.03);border:1px solid rgba(255,255,255,.06);border-radius:10px;padding:13px 16px}
.shot .row .name{font-size:13.5px;color:var(--ink)}
.shot .row .prog{margin-left:auto;width:180px;height:6px;border-radius:999px;background:rgba(255,255,255,.08);overflow:hidden;flex:none}
.shot .row .prog b{display:block;height:100%;background:var(--grad);border-radius:999px}
.shot .row .pct{font-size:12px;color:var(--ink-dim);width:38px;text-align:right;flex:none}
.shot .sec{font-size:11.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-faint);margin:6px 0 -2px}

/* ---------- generic section ---------- */
.band{padding:78px 0}
.band h2{font-size:clamp(1.7rem,3.6vw,2.4rem);letter-spacing:-.02em;font-weight:800;text-align:center;margin-bottom:14px}
.band .lead{color:var(--ink-dim);text-align:center;max-width:56ch;margin:0 auto 48px;font-size:1.03rem}
.eyebrow{display:block;text-align:center;font-size:12px;letter-spacing:.16em;text-transform:uppercase;color:var(--cyan);font-weight:700;margin-bottom:14px}

/* ---------- features ---------- */
.grid{display:grid;gap:18px;grid-template-columns:repeat(3,1fr)}
.feat{background:var(--card);border:1px solid var(--card-brd);border-radius:var(--radius);padding:26px}
.feat .ic{width:42px;height:42px;border-radius:11px;display:grid;place-items:center;margin-bottom:16px;background:rgba(56,189,248,.12);border:1px solid rgba(56,189,248,.25)}
.feat .ic svg{width:21px;height:21px;stroke:var(--cyan)}
.feat h3{font-size:15.5px;margin-bottom:7px;letter-spacing:-.01em}
.feat p{font-size:13.7px;color:var(--ink-dim)}

/* ---------- steps ---------- */
.steps{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;counter-reset:s}
.step{background:var(--card);border:1px solid var(--card-brd);border-radius:var(--radius);padding:26px;position:relative}
.step::before{counter-increment:s;content:counter(s);position:absolute;top:20px;right:22px;font-size:44px;font-weight:800;color:rgba(255,255,255,.06);line-height:1}
.step h3{font-size:15.5px;margin-bottom:7px}
.step p{font-size:13.7px;color:var(--ink-dim)}

/* ---------- platforms ---------- */
.platgrid{display:grid;grid-template-columns:repeat(5,1fr);gap:12px;max-width:940px;margin:0 auto}
.platgrid .p{display:flex;flex-direction:column;align-items:center;justify-content:flex-start;gap:9px;padding:18px 8px;background:var(--card);border:1px solid var(--card-brd);border-radius:12px;text-align:center;transition:border-color .15s,transform .15s}
.platgrid .p:hover{border-color:rgba(255,255,255,.2);transform:translateY(-2px)}
.platgrid .p svg{width:26px;height:26px;flex:none}
.platgrid .p .mono{width:26px;height:26px;border-radius:7px;display:grid;place-items:center;font-size:13px;font-weight:800;color:#fff;flex:none;line-height:1}
.platgrid .p span{font-size:11.5px;color:var(--ink-dim);line-height:1.3}
.platgrid .more{grid-column:span 5;text-align:center;font-size:12.5px;color:var(--ink-faint);padding-top:4px}
.platgrid.mini{grid-template-columns:repeat(5,1fr);max-width:700px}
.platgrid .p .tiny{font-size:9.5px;color:var(--ink-faint)}
.platsub{text-align:center;font-size:13px;letter-spacing:.14em;text-transform:uppercase;color:var(--cyan);font-weight:700;margin:40px 0 6px}
.platsub-lead{text-align:center;font-size:13px;color:var(--ink-dim);margin:0 auto 20px;max-width:46ch}
.note{max-width:62ch;margin:30px auto 0;text-align:center;font-size:12.8px;color:var(--ink-faint);border:1px dashed rgba(255,255,255,.12);border-radius:12px;padding:16px 20px}
.note a{color:var(--cyan)}
.note a:hover{text-decoration:underline}

/* ---------- pricing ---------- */
.prices{display:grid;grid-template-columns:repeat(2,1fr);gap:20px;max-width:760px;margin:0 auto}
.price{background:var(--card);border:1px solid var(--card-brd);border-radius:var(--radius);padding:30px}
.price.hi{border-color:rgba(56,189,248,.4);box-shadow:0 0 0 1px rgba(56,189,248,.15),0 30px 80px -40px rgba(56,189,248,.4)}
.price h3{font-size:14px;letter-spacing:.04em;text-transform:uppercase;color:var(--ink-dim);margin-bottom:10px}
.price .amt{font-size:2.3rem;font-weight:800;letter-spacing:-.03em}
.price .amt small{font-size:.9rem;font-weight:500;color:var(--ink-faint)}
.price .amt .was{font-size:1.15rem;font-weight:600;color:var(--ink-faint);text-decoration:line-through;margin-right:10px}
.price ul{list-style:none;margin:20px 0 24px;display:grid;gap:10px}
.price li{font-size:13.7px;color:var(--ink-dim);display:flex;gap:10px;align-items:flex-start}
.price li svg{width:16px;height:16px;stroke:var(--cyan);flex:none;margin-top:3px}
.price .btn{width:100%;justify-content:center}
.price .buy-hint{margin:10px 0 0;font-size:11.5px;line-height:1.5;color:var(--ink-faint);text-align:center}
.price .badge{display:inline-block;font-size:11px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;color:var(--cyan);background:rgba(34,211,238,.12);border:1px solid rgba(34,211,238,.3);padding:3px 9px;border-radius:999px;margin-bottom:12px}

/* ---------- download ---------- */
.dl{background:linear-gradient(135deg,rgba(56,189,248,.1),rgba(99,102,241,.1));border:1px solid var(--card-brd);border-radius:22px;padding:52px 40px;text-align:center;max-width:820px;margin:0 auto}
.dl h2{margin-bottom:12px}
.dl p{color:var(--ink-dim);margin-bottom:26px}
.dl .btn{padding:15px 30px;font-size:15.5px}
.dl .specs{margin-top:26px;display:flex;gap:26px;justify-content:center;flex-wrap:wrap;font-size:12.5px;color:var(--ink-faint)}
.dl .specs b{color:var(--ink-dim);font-weight:600}

/* ---------- about ---------- */
.about{display:grid;grid-template-columns:1.1fr .9fr;gap:40px;align-items:start;max-width:960px;margin:0 auto}
.about .prose p{color:var(--ink-dim);font-size:14.5px;margin-bottom:14px}
.about .prose p strong{color:var(--ink)}
.about .facts{background:var(--card);border:1px solid var(--card-brd);border-radius:var(--radius);padding:24px;display:grid;gap:14px}
.about .facts div{display:grid;gap:2px}
.about .facts dt{font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-faint)}
.about .facts dd{font-size:14px;color:var(--ink)}
.about .facts dd a{color:var(--cyan)}

/* ---------- reviews ---------- */
.reviews{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;max-width:1000px;margin:0 auto}
.review{background:var(--card);border:1px solid var(--card-brd);border-radius:var(--radius);padding:24px;display:flex;flex-direction:column;gap:12px}
.review .stars{color:var(--cyan);letter-spacing:2px;font-size:14px}
.review p{font-size:13.8px;color:var(--ink-dim);flex:1}
.review .who{font-size:12.5px;color:var(--ink-faint)}
.review .who b{color:var(--ink-dim);font-weight:600}
.reviews-cta{text-align:center;margin-top:30px;font-size:13.5px;color:var(--ink-dim)}
.reviews-cta a{color:var(--cyan)}

/* ---------- faq ---------- */
.faq{max-width:780px;margin:0 auto;display:grid;gap:12px}
.faq details{background:var(--card);border:1px solid var(--card-brd);border-radius:12px;padding:4px 20px}
.faq summary{cursor:pointer;list-style:none;padding:16px 0;font-weight:600;font-size:14.5px;display:flex;justify-content:space-between;align-items:center;gap:16px}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";font-size:20px;color:var(--ink-faint);font-weight:400;flex:none}
.faq details[open] summary::after{content:"\2013"}
.faq details p{padding:0 0 18px;font-size:13.7px;color:var(--ink-dim)}

/* ---------- footer ---------- */
.site-footer{border-top:1px solid rgba(255,255,255,.06);padding:44px 0;margin-top:40px}
.foot{display:flex;flex-wrap:wrap;gap:12px 20px;align-items:center;justify-content:space-between;font-size:13px;color:var(--ink-faint)}
.foot .links{display:flex;flex-wrap:wrap;gap:8px 20px;list-style:none}
.foot .links a:hover{color:var(--ink-dim)}
.foot .brand{font-size:13px;color:var(--ink-dim)}
.foot-legal{margin-top:14px;padding-top:14px;border-top:1px solid rgba(255,255,255,.06);font-size:12px}
.foot-legal .links a{color:var(--ink-faint)}
.foot-legal .links a:hover{color:var(--cyan)}
.disclaimer{max-width:var(--maxw);margin:20px auto 0;padding:0 24px;font-size:11.5px;color:var(--ink-faint);text-align:center;line-height:1.7}
.disclaimer a{color:var(--ink-dim)}
.disclaimer a:hover{color:var(--cyan)}

/* ---------- inner pages (legal / posts) ---------- */
.page-wrap{max-width:820px;margin:0 auto;padding:52px 24px 80px}
.page-wrap h1{font-size:clamp(1.7rem,4vw,2.3rem);letter-spacing:-.02em;margin-bottom:14px}
.page-wrap .entry{color:var(--ink-dim);font-size:14.4px;line-height:1.8}
.page-wrap .entry h2{font-size:1.12rem;margin:34px 0 12px;color:var(--ink);scroll-margin-top:84px}
.page-wrap .entry h3{font-size:1rem;margin:20px 0 8px;color:var(--ink)}
.page-wrap .entry p{margin:0 0 14px}
.page-wrap .entry ul,.page-wrap .entry ol{margin:0 0 16px;padding-left:22px}
.page-wrap .entry li{margin-bottom:7px}
.page-wrap .entry a{color:var(--cyan)}
.page-wrap .entry strong{color:var(--ink)}
.page-wrap .entry table{width:100%;border-collapse:collapse;margin:16px 0;font-size:13.6px}
.page-wrap .entry th,.page-wrap .entry td{text-align:left;padding:10px 12px;border:1px solid var(--card-brd);vertical-align:top}
.page-wrap .entry th{color:var(--ink);background:rgba(255,255,255,.03)}
.page-wrap .updated{color:var(--ink-faint);font-size:13px;margin-bottom:26px}
.pagination{margin-top:30px;font-size:13px}
.pagination a{color:var(--cyan)}

/* ---------- mobile nav toggle ---------- */
.nav-toggle{display:none;margin-left:auto;width:38px;height:34px;flex-direction:column;justify-content:center;gap:5px;
  border:1px solid var(--card-brd);border-radius:9px;cursor:pointer;padding:0 9px;background:var(--card)}
.nav-toggle span{display:block;height:2px;background:var(--ink);border-radius:2px;transition:.2s}
.nav-toggle-cb:checked ~ .nav-toggle span:nth-child(1){transform:translateY(7px) rotate(45deg)}
.nav-toggle-cb:checked ~ .nav-toggle span:nth-child(2){opacity:0}
.nav-toggle-cb:checked ~ .nav-toggle span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}

/* ---------- widgets ---------- */
.widget{margin:0 0 18px}
.widget:last-child{margin-bottom:0}
.widget-title{font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-faint);margin:0 0 12px;font-weight:700}
.widget a{color:var(--cyan)}
.widget ul{list-style:none;margin:0;padding:0}
.widget li{margin:0 0 8px;font-size:13.5px;color:var(--ink-dim)}
.widget p{font-size:13.5px;color:var(--ink-dim);margin:0 0 10px}
.widget select,.widget input[type=search],.widget input[type=text]{width:100%;padding:9px 12px;border-radius:8px;
  border:1px solid var(--card-brd);background:var(--card);color:var(--ink);font:inherit}

.footer-widgets{display:grid;gap:24px;padding-bottom:30px;margin-bottom:8px;border-bottom:1px solid rgba(255,255,255,.06)}
.footer-widgets.cols-1{grid-template-columns:1fr}
.footer-widgets.cols-2{grid-template-columns:repeat(2,1fr)}
.footer-widgets.cols-3{grid-template-columns:repeat(3,1fr)}
.footer-widgets.cols-4{grid-template-columns:repeat(4,1fr)}

.hero-extra{max-width:640px;margin:22px auto 0}
.hero-extra .widget{margin-bottom:10px}

.page-wrap.has-sidebar{display:grid;grid-template-columns:minmax(0,1fr) 280px;gap:44px;align-items:start;max-width:1060px}
.page-sidebar{position:sticky;top:84px}

/* full-width page template (shortcodes, page builders, WooCommerce) */
.page-wrap.full{max-width:var(--maxw)}
.page-wrap.full > .page-main > h1{font-size:clamp(1.8rem,4vw,2.4rem);text-align:center;margin-bottom:30px}
.td-canvas{background:var(--bg);color:var(--ink)}

/* [td_buy] + [td_support] shortcode blocks */
.td-buy,.td-support{margin:10px 0}
.td-buy .btn,.td-support .btn{text-decoration:none}
.td-support .grid .feat p:last-child{margin-top:14px}
.td-support .faq{max-width:780px}
.td-support h2,.td-buy h2{font-size:clamp(1.4rem,3vw,1.9rem);margin:0 0 20px}
/* legibility inside page content: headings & FAQ questions stay bright */
.page-wrap .entry .feat h3,
.page-wrap .entry .price h3,
.page-wrap .entry .faq summary{color:var(--ink)}
.page-wrap .entry .price .amt{color:var(--ink)}
.page-wrap .entry .faq details p{color:var(--ink-dim)}
.page-wrap .entry .btn-primary{color:#0a1020;text-decoration:none}
.page-wrap .entry .btn-ghost{color:var(--ink);text-decoration:none}
.page-wrap .entry .td-buy .note,.page-wrap .entry .td-support .note{max-width:760px;margin-left:auto;margin-right:auto;text-align:center}
.page-wrap .entry .td-buy .prices{margin-bottom:24px}
.page-wrap .entry .td-buy .note{margin-top:14px}
.page-wrap .entry .td-support .grid .feat{text-align:center}
.page-wrap .entry .td-support .grid .feat .btn{margin-left:auto;margin-right:auto}
.page-wrap .entry .td-support .grid .feat-primary{border-color:rgba(34,211,238,.35);background:rgba(34,211,238,.06)}

/* comments */
.comments-area{max-width:780px;margin:40px auto 0}
.comments-title{font-size:1.1rem;margin-bottom:16px}
.comment-list{list-style:none;margin:0 0 24px;padding:0}
.comment-list li{border:1px solid var(--card-brd);border-radius:10px;padding:14px 16px;margin-bottom:12px;background:var(--card)}
.comment-list .comment-author{font-size:13px;color:var(--ink)}
.comment-respond input[type=text],.comment-respond input[type=email],.comment-respond input[type=url],.comment-respond textarea{
  width:100%;padding:10px 12px;border-radius:8px;border:1px solid var(--card-brd);background:var(--card);color:var(--ink);font:inherit;margin-bottom:10px}
.comment-respond .submit{background:var(--grad);color:#0a1020;border:0;border-radius:9px;padding:10px 20px;font-weight:600;cursor:pointer}

@media (max-width:900px){
  .grid,.steps,.reviews{grid-template-columns:repeat(2,1fr)}
  .platgrid{grid-template-columns:repeat(4,1fr)}
  .platgrid.mini{grid-template-columns:repeat(5,1fr);max-width:600px}
  .platgrid .more{grid-column:span 4}
  .about{grid-template-columns:1fr;gap:26px}
  .footer-widgets.cols-3,.footer-widgets.cols-4{grid-template-columns:repeat(2,1fr)}
  .page-wrap.has-sidebar{grid-template-columns:1fr;gap:30px}
  .page-sidebar{position:static}

  .nav-toggle{display:flex}
  .nav{flex-wrap:wrap;height:auto;min-height:66px}
  .nav .primary-nav{order:3;flex-basis:100%;display:none}
  /* opaque panel, edge-to-edge, so hero content doesn't bleed through */
  .nav-toggle-cb:checked ~ .primary-nav{display:block;background:var(--bg-2);
    margin:10px -24px 0;padding:2px 24px 8px;border-top:1px solid rgba(255,255,255,.09)}
  .nav .primary-nav .links{display:flex;flex-direction:column;gap:0;width:100%;padding:2px 0}
  .nav .primary-nav .links li{width:100%}
  .nav .primary-nav .links a{display:block;padding:13px 2px;font-size:15px;
    color:var(--ink);border-bottom:1px solid rgba(255,255,255,.08)}
  .nav .primary-nav .links li:last-child a{border-bottom:0}
  .nav .primary-nav .links a:hover,.nav .primary-nav .links a:focus{color:var(--cyan)}
  .nav .nav-cta{display:none}
  .nav-toggle-cb:checked ~ .nav-cta{display:inline-flex;width:calc(100% + 48px);
    justify-content:center;margin:10px -24px 0;order:4;flex-basis:100%;padding:13px}
}
@media (max-width:620px){
  .grid,.steps,.prices,.reviews{grid-template-columns:1fr}
  .platgrid{grid-template-columns:repeat(3,1fr)}
  .platgrid.mini{grid-template-columns:repeat(3,1fr);max-width:360px}
  .platgrid .more{grid-column:span 3}
  .footer-widgets{grid-template-columns:1fr!important}
  .shot .row .prog{width:90px}
  .hero{padding:60px 0 50px}
  .band{padding:60px 0}
}