:root{
  --dm-bg:#f6f7f9;--dm-paper:#fff;--dm-ink:#101216;--dm-muted:#647080;--dm-line:rgba(16,18,22,.10);
  --dm-red:#e11d2e;--dm-red-dark:#b31321;--dm-gold:#c7a13a;--dm-green:#166b47;--dm-dark:#111318;--dm-dark-2:#191c22;
  --dm-radius:20px;--dm-ease:cubic-bezier(.22,1,.36,1);--dm-shadow:0 20px 55px rgba(22,24,30,.10);--dm-shadow-sm:0 8px 24px rgba(22,24,30,.07);
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;font-family:"DM Sans",system-ui,sans-serif;background:var(--dm-bg);color:var(--dm-ink);overflow-x:hidden}
a{text-decoration:none;color:inherit}
button{font:inherit;border:0;background:none;cursor:pointer}
/* ---------- text selection ----------
   No ::selection rule existed anywhere, so selecting text (including simply
   dragging the pointer across a title) painted the browser's default BLUE
   highlight behind it. This harmonises the selection with the brand: white on
   the DM red, readable in both light and dark themes. Text stays fully
   selectable and copyable. */
::selection{background:var(--dm-red);color:#fff}
::-moz-selection{background:var(--dm-red);color:#fff}
.dm-shell{width:min(1320px,calc(100% - 56px));margin-inline:auto}
.dm-noise{position:fixed;inset:0;pointer-events:none;z-index:100;opacity:.035;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160' viewBox='0 0 160 160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.95' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.5'/%3E%3C/svg%3E")}
/* ---------- global navigation ---------- */
.dm-topbar{position:fixed;top:0;left:0;right:0;z-index:70;height:84px;background:rgba(246,247,249,.82);backdrop-filter:blur(24px) saturate(150%);border-bottom:1px solid transparent;transition:.35s var(--dm-ease)}
.dm-topbar.scrolled{background:rgba(246,247,249,.96);border-bottom-color:var(--dm-line);box-shadow:0 12px 35px rgba(17,19,24,.05)}
.dm-topbar-inner{height:100%;display:flex;align-items:center;justify-content:space-between;gap:20px}
.dm-brand{display:inline-flex;align-items:center;gap:10px;font-family:"Space Grotesk",sans-serif;font-weight:700}
.dm-brand-mark{width:42px;height:42px;border-radius:14px;display:grid;place-items:center;background:#fff;border:1px solid var(--dm-line);box-shadow:0 7px 18px rgba(15,23,42,.08);overflow:hidden}
.dm-brand-mark img{width:30px;height:30px;object-fit:contain}
.dm-brand-word{font-size:1.05rem;letter-spacing:-.035em}.dm-brand-word span{color:var(--dm-red)}.dm-brand-word i{display:inline-block;width:5px;height:5px;margin:0 0 2px 5px;border-radius:50%;background:var(--dm-gold)}
.dm-main-nav{display:flex;align-items:center;gap:7px;margin-left:40px}.dm-main-nav a{padding:10px 14px;border-radius:13px;color:#565b63;font-size:13px;font-weight:650;transition:.25s var(--dm-ease)}.dm-main-nav a:hover{background:#fff;color:var(--dm-ink);transform:translateY(-1px)}
.dm-top-actions{display:flex;align-items:center;gap:8px}.dm-circle-btn{width:42px;height:42px;border-radius:13px;display:grid;place-items:center;color:#585e67;transition:.25s var(--dm-ease)}.dm-circle-btn:hover{background:#fff;box-shadow:0 7px 20px rgba(15,23,42,.07);transform:translateY(-1px)}
.dm-text-link{padding:11px 12px;color:#565b63;font-size:13px;font-weight:650}.dm-header-cta,.dm-primary-action{display:inline-flex;align-items:center;justify-content:center;gap:12px;padding:14px 18px;border-radius:15px;background:var(--dm-ink);color:#fff;font-size:13px;font-weight:800;box-shadow:0 14px 28px rgba(16,18,22,.16);transition:.32s var(--dm-ease)}.dm-header-cta{padding:12px 15px}.dm-header-cta:hover,.dm-primary-action:hover{transform:translateY(-3px);box-shadow:0 20px 38px rgba(16,18,22,.20)}
.dm-menu-btn{display:none}.dm-mobile-menu{border-top:1px solid var(--dm-line);background:rgba(246,247,249,.98);backdrop-filter:blur(18px)}.dm-mobile-menu.hidden{display:none}.dm-mobile-menu-inner{display:grid;gap:5px;padding:12px 0 18px}.dm-mobile-menu a{padding:13px 14px;border-radius:13px;font-weight:700;color:#4e535a}.dm-mobile-menu a.is-primary{background:var(--dm-red);color:#fff}
/* ---------- hero ---------- */
.dm-home{padding-top:84px}.dm-hero{position:relative;min-height:760px;overflow:hidden;background:linear-gradient(135deg,#f7f5f0 0%,#f4f2ed 58%,#ece8df 100%)}
.dm-hero::before{content:"";position:absolute;inset:0;background:radial-gradient(circle at 76% 36%,rgba(225,29,46,.08),transparent 22%),radial-gradient(circle at 52% 10%,rgba(199,161,58,.12),transparent 20%);pointer-events:none}
.dm-grid-plane{position:absolute;right:-11vw;top:80px;width:61vw;height:61vw;max-width:940px;max-height:940px;opacity:.33;transform:rotate(28deg) perspective(900px) rotateX(67deg);background-image:linear-gradient(rgba(16,18,22,.08) 1px,transparent 1px),linear-gradient(90deg,rgba(16,18,22,.08) 1px,transparent 1px);background-size:46px 46px;mask-image:radial-gradient(circle at 55% 45%,#000 10%,transparent 72%)}
.dm-hero-ambient{position:absolute;border-radius:50%;filter:blur(2px);pointer-events:none}.ambient-a{width:360px;height:360px;right:15%;top:170px;background:radial-gradient(circle,rgba(225,29,46,.16),transparent 70%)}.ambient-b{width:500px;height:500px;right:0;bottom:-230px;background:radial-gradient(circle,rgba(199,161,58,.17),transparent 68%)}
.dm-hero-layout{position:relative;z-index:2;min-height:676px;display:grid;grid-template-columns:.92fr 1.08fr;align-items:center;gap:30px}.dm-hero-copy{padding:50px 0}.dm-kicker,.dm-section-index{display:inline-flex;align-items:center;gap:9px;color:#747981;font-size:11px;font-weight:850;letter-spacing:.14em;text-transform:uppercase}.pulse-dot{width:8px;height:8px;border-radius:50%;background:var(--dm-red);box-shadow:0 0 0 6px rgba(225,29,46,.08)}
.dm-hero h1,.dm-section-intro h2,.dm-method-left h2,.closing-inner h2{font-family:"Space Grotesk",sans-serif;letter-spacing:-.065em;line-height:.92;font-size:clamp(4rem,7vw,7.4rem);margin:24px 0 22px;font-weight:700}.dm-hero h1 em,.dm-section-intro h2 em,.dm-method-left h2 em,.closing-inner h2 em{font-style:normal;color:var(--dm-red)}
.dm-hero-lead{max-width:600px;font-size:16px;line-height:1.78;color:#646a72;margin:0}.dm-hero-actions{display:flex;gap:15px;align-items:center;margin-top:30px}.dm-secondary-action{display:inline-flex;align-items:center;gap:10px;padding:12px 7px;color:#40454c;font-size:13px;font-weight:750}.dm-play{width:36px;height:36px;display:grid;place-items:center;border-radius:50%;background:#fff;box-shadow:0 8px 20px rgba(15,23,42,.08);font-size:10px}
.dm-hero-metrics{display:flex;gap:35px;margin-top:54px}.dm-hero-metrics div{display:grid;gap:3px}.dm-hero-metrics strong{font-family:"Space Grotesk";font-size:1.3rem}.dm-hero-metrics span{font-size:10px;font-weight:750;text-transform:uppercase;letter-spacing:.08em;color:#8a8f95}
/* ---------- 3D cockpit ---------- */
.dm-hero-stage{position:relative;min-height:610px;display:grid;place-items:center;transform-style:preserve-3d}.dm-stage-shadow{position:absolute;width:62%;height:14%;bottom:10%;border-radius:50%;background:rgba(29,31,37,.17);filter:blur(28px);transform:rotate(-9deg);}.dm-stage-orbit{position:absolute;border:1px solid rgba(16,18,22,.12);border-radius:50%;transform:rotate(58deg) rotateX(71deg);animation:orbitSpin 18s linear infinite}.orbit-1{width:76%;height:31%;top:24%;right:5%}.orbit-2{width:62%;height:24%;top:35%;right:13%;border-style:dashed;animation-duration:25s;animation-direction:reverse}@keyframes orbitSpin{to{transform:rotate(418deg) rotateX(71deg)}}
.dm-cockpit{position:relative;width:min(650px,94%);padding:20px;border-radius:30px;background:linear-gradient(160deg,rgba(255,255,255,.90),rgba(244,245,246,.72));border:1px solid rgba(255,255,255,.72);box-shadow:0 40px 100px rgba(22,24,30,.16),inset 0 1px 0 rgba(255,255,255,.8);transform:rotateY(-13deg) rotateX(7deg) rotateZ(-2deg);transform-style:preserve-3d}.dm-cockpit::after{content:"";position:absolute;inset:10px;border-radius:23px;border:1px solid rgba(16,18,22,.05);pointer-events:none}.dm-cockpit-top{display:flex;align-items:center;justify-content:space-between;padding:3px 4px 15px;color:#747a81;font-size:10px;font-weight:800;letter-spacing:.08em;text-transform:uppercase}.dm-cockpit-brand{display:flex;align-items:center;gap:8px}.mini-logo{width:24px;height:24px;display:grid;place-items:center;border-radius:8px;background:var(--dm-ink);color:#fff;font-family:"Space Grotesk"}.live-dot{display:flex;align-items:center;gap:7px}.live-dot i{width:6px;height:6px;border-radius:50%;background:var(--dm-red);box-shadow:0 0 0 4px rgba(225,29,46,.08)}
.dm-cockpit-main{display:grid;grid-template-columns:1fr 1.38fr;gap:12px}.dm-cockpit-side,.dm-cockpit-chart{background:rgba(255,255,255,.62);border:1px solid rgba(16,18,22,.06);border-radius:18px}.dm-cockpit-side{padding:22px}.side-label{font-size:9px;color:#90959b;font-weight:900;letter-spacing:.13em}.dm-cockpit-side>strong{display:block;font-family:"Space Grotesk";font-size:5rem;line-height:.95;margin:18px 0 10px;letter-spacing:-.08em}.side-sub{display:block;max-width:165px;color:#7a8087;font-size:11px;line-height:1.5}.side-progress{height:7px;margin-top:25px;background:#eceef0;border-radius:999px;overflow:hidden}.side-progress span{display:block;width:68%;height:100%;border-radius:inherit;background:linear-gradient(90deg,var(--dm-red),#f45b65)}.side-percent{display:block;margin-top:8px;color:#555b63;font-size:10px;font-weight:800}.dm-cockpit-chart{padding:20px 20px 14px}.chart-head{display:flex;justify-content:space-between;align-items:center;font-size:11px;color:#757b82}.chart-head strong{color:var(--dm-green);font-size:11px}.chart-bars{display:flex;align-items:flex-end;gap:11px;height:175px;padding:26px 6px 8px}.chart-bars i{display:block;flex:1;height:var(--h);min-width:10px;border-radius:10px 10px 4px 4px;background:linear-gradient(180deg,#14171c,#4c5158);animation:barsIn .9s var(--dm-ease) both}.chart-bars i:nth-child(2){animation-delay:.07s}.chart-bars i:nth-child(3){animation-delay:.14s}.chart-bars i:nth-child(4){animation-delay:.21s}.chart-bars i:nth-child(5){animation-delay:.28s}.chart-bars i:nth-child(6){animation-delay:.35s}.chart-bars i:nth-child(7){background:linear-gradient(180deg,var(--dm-red),#ff646e);animation-delay:.42s}@keyframes barsIn{from{transform:scaleY(.3);opacity:.2}to{transform:none;opacity:1}}.chart-axis{display:flex;justify-content:space-between;color:#a0a5ab;font-size:8px;font-weight:700}.dm-cockpit-bottom{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:11px}.lesson-row{display:flex;align-items:center;gap:10px;min-width:0;padding:13px;border-radius:16px;background:#15181d;color:#fff}.lesson-row.accent{background:linear-gradient(135deg,#f5eee4,#e8dcc8);color:#1b1d21}.lesson-icon{width:32px;height:32px;display:grid;place-items:center;border-radius:11px;background:rgba(255,255,255,.10);font-size:11px;flex:0 0 auto}.lesson-row.accent .lesson-icon{background:rgba(16,18,22,.08)}.lesson-row>div{display:grid;gap:2px;min-width:0}.lesson-row small{font-size:8px;text-transform:uppercase;letter-spacing:.1em;opacity:.55;font-weight:800}.lesson-row strong{font-size:11px;white-space:nowrap}.lesson-time{margin-left:auto;font-size:9px;font-weight:850;opacity:.55;white-space:nowrap}.dm-float-chip{position:absolute;z-index:4;display:flex;align-items:center;gap:7px;padding:10px 12px;border-radius:999px;background:rgba(255,255,255,.88);border:1px solid rgba(255,255,255,.9);box-shadow:0 18px 35px rgba(19,23,31,.12);font-size:10px;font-weight:800;backdrop-filter:blur(16px);animation:floatY 4.5s ease-in-out infinite}.dm-float-chip b{margin-left:5px;color:var(--dm-red)}.chip-level{top:16%;right:-1%}.chip-score{left:-3%;bottom:24%;animation-delay:-1.8s}.chip-score i{color:var(--dm-gold)}.chip-telc{right:7%;bottom:13%;animation-delay:-.8s}html.dark .dm-cockpit{background:linear-gradient(160deg,rgba(23,27,34,.965),rgba(13,16,21,.94));border-color:rgba(255,255,255,.10);box-shadow:0 40px 100px rgba(0,0,0,.55),inset 0 1px 0 rgba(255,255,255,.05)}html.dark .dm-cockpit::after{border-color:rgba(255,255,255,.07)}html.dark .dm-cockpit-top{color:#aab2bd}html.dark .side-label{color:#9aa3ae}html.dark .side-sub{color:#98a1ac}html.dark .side-progress{background:rgba(255,255,255,.12)}html.dark .side-percent{color:#c2c9d2}html.dark .chart-head{color:#a5adb8}html.dark .chart-axis{color:#8d96a1}html.dark .chart-bars i{background:linear-gradient(180deg,#ccd3dc,#7d8793)}html.dark .chart-bars i:nth-child(7){background:linear-gradient(180deg,var(--dm-red),#ff646e)}html.dark .dm-cockpit-side,html.dark .dm-cockpit-chart{background:rgba(255,255,255,.045);border-color:rgba(255,255,255,.08)}html.dark .lesson-row{background:#1f252e;box-shadow:inset 0 0 0 1px rgba(255,255,255,.06)}html.dark .dm-float-chip{background:rgba(30,34,42,.92);border-color:rgba(255,255,255,.10);color:#e6e9ee;box-shadow:0 18px 35px rgba(0,0,0,.45)}@keyframes floatY{0%,100%{transform:translateY(0)}50%{transform:translateY(-9px)}}
.dm-scroll-line{position:absolute;left:50%;bottom:25px;display:flex;align-items:center;gap:9px;color:#898f97;transform:translateX(-50%);font-size:9px;letter-spacing:.12em;text-transform:uppercase}.dm-scroll-line span{width:26px;height:1px;background:#a8adb2}.dm-scroll-line small{font-size:9px}
/* ---------- common sections ---------- */
.dm-trust-strip{background:var(--dm-ink);color:#fff;border-top:1px solid rgba(255,255,255,.05);border-bottom:1px solid rgba(255,255,255,.07)}.dm-trust-inner{display:flex;align-items:center;justify-content:space-between;gap:22px;min-height:72px}.trust-copy{font-size:10px;letter-spacing:.12em;color:#707680;font-weight:900}.dm-trust-inner>span:not(.trust-copy){font-size:11px;color:#bec4cb;display:flex;gap:8px;align-items:center}.dm-trust-inner i{color:#fff}
.dm-section{padding:125px 0}.dm-section-intro{display:grid;grid-template-columns:1.12fr .65fr;gap:50px;align-items:end;margin-bottom:58px}.dm-section-intro h2,.dm-method-left h2{font-size:clamp(3.2rem,5.2vw,5.7rem);margin:18px 0 0}.dm-section-intro p,.dm-method-left>p{max-width:480px;color:#747a80;line-height:1.8;font-size:14px}.dm-section-intro p strong{color:var(--dm-ink)}
/* ---------- levels ---------- */
.dm-levels{background:var(--dm-paper)}.dm-levels-layout{display:grid;grid-template-columns:1fr 1fr;gap:18px}.dm-level-card{min-height:590px;position:relative;overflow:hidden;border-radius:36px;padding:30px;background:#eae7df;color:#13161a;box-shadow:var(--dm-shadow);transform-style:preserve-3d;transition:transform .45s var(--dm-ease),box-shadow .45s var(--dm-ease)}.dm-level-card:hover{box-shadow:0 42px 100px rgba(22,24,30,.18)}.level-b2{background:#dfe8e3}.level-card-noise{position:absolute;inset:0;background:radial-gradient(circle at 80% 10%,rgba(255,255,255,.72),transparent 34%),linear-gradient(120deg,transparent 54%,rgba(255,255,255,.25));}.level-top{position:relative;z-index:3;display:flex;justify-content:space-between;font-size:10px;text-transform:uppercase;letter-spacing:.12em;color:#737980;font-weight:900}.level-big{position:absolute;z-index:1;top:74px;left:26px;font-family:"Space Grotesk";font-size:15rem;line-height:.7;letter-spacing:-.1em;color:rgba(16,18,22,.08);font-weight:700}.level-content{position:absolute;z-index:4;left:30px;right:30px;bottom:31px}.level-tag{display:inline-flex;padding:8px 10px;border-radius:999px;background:rgba(16,18,22,.08);font-size:9px;font-weight:900;letter-spacing:.10em}.level-content h3{font-family:"Space Grotesk";font-size:2.2rem;letter-spacing:-.05em;margin:14px 0 10px}.level-content p{max-width:390px;color:#676c72;line-height:1.7;font-size:13px}.level-link{display:inline-flex;align-items:center;gap:9px;margin-top:16px;font-size:12px;font-weight:900}.level-link i{transition:.3s var(--dm-ease);color:var(--dm-red)}.dm-level-card:hover .level-link i{transform:translateX(5px)}.level-shape{position:absolute;right:5%;top:25%;width:62%;height:40%;transform:rotate(-14deg);border-radius:42% 58% 65% 35%/46% 37% 63% 54%;filter:blur(.2px);box-shadow:inset 20px 22px 44px rgba(255,255,255,.4),inset -18px -20px 50px rgba(20,24,30,.13),0 30px 50px rgba(16,18,22,.10)}.shape-b1{background:linear-gradient(135deg,#15181d,#454952 58%,#181a1f)}.shape-b2{background:linear-gradient(135deg,#173d2b,#6c8d78 58%,#1c2b22)}.level-orbit{position:absolute;width:52%;height:18%;right:4%;top:27%;border:1px solid rgba(16,18,22,.18);border-radius:50%;transform:rotate(20deg) rotateX(65deg);animation:orbitSpin 13s linear infinite}.orbit-b2{animation-direction:reverse;border-style:dashed}
/* ---------- bento ---------- */
.dm-experience{background:var(--dm-dark);color:#fff;position:relative;overflow:hidden}.dm-experience::before{content:"";position:absolute;width:580px;height:580px;right:-190px;top:-220px;background:radial-gradient(circle,rgba(225,29,46,.18),transparent 68%)}.dark-intro p{color:#9299a2}.dark-intro p strong{color:#fff}.dark-intro .dm-section-index{color:#77808b}.bento-grid{}.dm-bento-grid{display:grid;grid-template-columns:1.35fr .65fr .65fr;grid-auto-rows:245px;gap:14px}.bento{position:relative;padding:23px;border:1px solid rgba(255,255,255,.09);border-radius:25px;background:linear-gradient(150deg,#1b1f26,#12151a);overflow:hidden;transition:.4s var(--dm-ease)}.bento:hover{transform:translateY(-6px);border-color:rgba(255,255,255,.17);box-shadow:0 25px 55px rgba(0,0,0,.25)}.bento-large{grid-row:span 2}.bento-red{background:linear-gradient(155deg,#ed2738,#a91321)}.bento-meta{display:flex;justify-content:space-between;font-size:9px;font-weight:900;letter-spacing:.12em;text-transform:uppercase;color:#77808a}.bento-red .bento-meta{color:#ffcbd0}.bento-copy{position:absolute;left:23px;right:23px;bottom:22px}.bento-copy h3{font-family:"Space Grotesk";font-size:1.55rem;letter-spacing:-.05em;margin:0 0 7px}.bento-copy p{margin:0;max-width:460px;font-size:11px;line-height:1.6;color:#8e959f}.bento-red .bento-copy p{color:#ffd8dc}.dashboard-mini{position:absolute;left:24px;right:24px;top:68px;height:255px;border-radius:20px;background:#0e1014;border:1px solid rgba(255,255,255,.08);overflow:hidden}.mini-top{height:27px;background:#171b20;border-bottom:1px solid rgba(255,255,255,.05)}.mini-sidebar{position:absolute;left:0;top:27px;bottom:0;width:19%;background:#12151a;border-right:1px solid rgba(255,255,255,.05)}.mini-main{position:absolute;left:22%;right:15px;top:47px;display:grid;grid-template-columns:repeat(3,1fr);gap:9px}.mini-main i{height:72px;border-radius:12px;background:linear-gradient(145deg,#20252c,#14171b)}.mini-main i:last-child{background:linear-gradient(145deg,#e11d2e,#84131d)}.mini-main b{grid-column:1/-1;height:96px;border-radius:12px;background:linear-gradient(180deg,#1c2026,#15181c);position:relative;overflow:hidden}.mini-main b:after{content:"";position:absolute;left:8%;right:8%;bottom:20%;height:2px;background:linear-gradient(90deg,#434951,#e11d2e,#747b84);box-shadow:60px -25px 0 -1px rgba(255,255,255,.5)}.practice-visual{position:absolute;right:18px;top:74px;width:116px;height:116px;display:grid;place-items:center;border-radius:50%;background:conic-gradient(#fff 0 92%,rgba(255,255,255,.16) 92% 100%)}.practice-visual::after{content:"";position:absolute;inset:10px;border-radius:50%;background:#bf1727}.practice-visual span,.practice-visual small{position:relative;z-index:2;color:#fff}.practice-visual span{font-family:"Space Grotesk";font-size:2rem;font-weight:700;line-height:1}.practice-visual small{margin-top:50px;font-size:8px;text-transform:uppercase;opacity:.72}.practice-visual .ring{position:absolute;inset:-11px;border:1px solid rgba(255,255,255,.24);border-radius:50%;animation:pulseRing 2.5s ease-in-out infinite}@keyframes pulseRing{50%{transform:scale(1.07);opacity:.4}}
.momentum-visual{position:absolute;left:24px;right:24px;top:75px;height:90px}.spark-line{position:absolute;left:0;right:0;bottom:8px;height:60px;background:linear-gradient(160deg,transparent 46%,#d9dde2 47%,#d9dde2 49%,transparent 50%);clip-path:polygon(0 88%,14% 77%,28% 82%,42% 58%,56% 67%,71% 30%,84% 39%,100% 9%,100% 12%,85% 45%,72% 36%,57% 73%,42% 64%,28% 88%,14% 83%,0 94%)}.spark-dots{position:absolute;inset:0}.spark-dots i{position:absolute;width:7px;height:7px;border-radius:50%;background:#fff;box-shadow:0 0 0 4px rgba(255,255,255,.06)}.spark-dots i:nth-child(1){left:14%;bottom:28%}.spark-dots i:nth-child(2){left:42%;bottom:49%}.spark-dots i:nth-child(3){left:71%;bottom:70%}.spark-dots i:nth-child(4){left:84%;bottom:61%}.spark-dots i:nth-child(5){right:0;bottom:85%;background:var(--dm-red)}.phone-visual{position:absolute;top:59px;right:26px;width:92px;height:135px;border:6px solid #292e35;border-radius:19px;background:#0c0e12;box-shadow:0 18px 35px rgba(0,0,0,.25);padding:15px 10px;display:grid;gap:7px}.phone-visual span{display:block;height:10px;border-radius:4px;background:#272c32}.phone-visual span:nth-child(2){height:36px;background:linear-gradient(135deg,var(--dm-red),#8c141f)}.phone-visual b{display:block;height:8px;width:35%;border-radius:5px;background:#f0eee9;margin:auto}
/* ---------- method ---------- */
.dm-method{background:var(--dm-paper)}.dm-method-grid{display:grid;grid-template-columns:.8fr 1.2fr;gap:100px;align-items:start}.dm-method-left h2{font-size:clamp(3rem,5vw,5.4rem)}.dm-outline-action{display:inline-flex;align-items:center;gap:10px;border:1px solid var(--dm-line);padding:12px 15px;border-radius:14px;font-size:12px;font-weight:850;margin-top:14px;transition:.25s var(--dm-ease)}.dm-outline-action:hover{background:#fff;transform:translateY(-2px);box-shadow:var(--dm-shadow-sm)}.dm-method-steps{border-top:1px solid var(--dm-line)}.method-step{display:grid;grid-template-columns:70px 1fr 25px;gap:20px;align-items:center;padding:24px 0;border-bottom:1px solid var(--dm-line);transition:.3s var(--dm-ease)}.method-step>span{font-family:"Space Grotesk";font-size:12px;color:#a4a9af}.method-step h3{font-family:"Space Grotesk";font-size:20px;letter-spacing:-.03em;margin:0 0 6px}.method-step p{margin:0;color:#7d8288;line-height:1.65;font-size:12px}.method-step>i{color:#a4a9af;font-size:12px;transform:rotate(45deg);transition:.3s var(--dm-ease)}.method-step:hover{padding-left:10px;background:linear-gradient(90deg,rgba(16,18,22,.025),transparent)}.method-step:hover>i{color:var(--dm-red);transform:translate(3px,-3px) rotate(45deg)}
/* ---------- pricing ---------- */
.dm-pricing{background:var(--dm-paper)}.dm-pricing-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}.dm-price-card{position:relative;padding:30px;border:1px solid rgba(16,18,22,.08);border-radius:28px;background:rgba(255,255,255,.63);box-shadow:0 20px 50px rgba(20,23,28,.07);transition:.4s var(--dm-ease);overflow:hidden}.dm-price-card:hover{transform:translateY(-7px);box-shadow:0 34px 75px rgba(20,23,28,.11)}.dm-price-card.popular{background:var(--dm-dark);color:#fff;border-color:rgba(255,255,255,.08);box-shadow:0 25px 70px rgba(16,18,22,.20);transform:translateY(-10px)}.dm-price-card.popular:hover{transform:translateY(-15px)}.popular-badge{position:absolute;right:16px;top:16px;padding:7px 9px;background:var(--dm-red);border-radius:999px;font-size:8px;font-weight:900;letter-spacing:.1em}.price-head{display:flex;justify-content:space-between;color:#848990;font-size:10px;font-weight:900;letter-spacing:.1em;text-transform:uppercase}.popular .price-head{color:#8f969e}.price-tier{font-size:9px;letter-spacing:.16em;color:var(--dm-red);font-weight:900;margin-top:34px}.price{display:flex;align-items:baseline;gap:7px;margin-top:7px}.price strong{font-family:"Space Grotesk";font-size:4rem;letter-spacing:-.08em}.price span{font-size:10px;color:#858b91;font-weight:700}.popular .price span{color:#858b95}.dm-price-card>p{min-height:46px;color:#737981;line-height:1.65;font-size:12px;margin:15px 0 20px}.popular>p{color:#9da4ad}.dm-price-card ul{list-style:none;padding:0;margin:0 0 24px;display:grid;gap:10px}.dm-price-card li{display:flex;align-items:center;gap:9px;font-size:11px;color:#555b63;font-weight:650}.popular li{color:#c9ced4}.dm-price-card li i.fa-check{color:var(--dm-green)}.dm-price-card li i.fa-xmark{color:#a6abb1}.popular li i.fa-check{color:#8bd0ac}.price-action{display:flex;align-items:center;justify-content:center;gap:10px;padding:13px 14px;border-radius:14px;background:var(--dm-ink);color:#fff;font-size:11px;font-weight:850;transition:.25s var(--dm-ease)}.price-action:hover{transform:translateY(-2px)}.price-action.solid{background:var(--dm-red);box-shadow:0 13px 28px rgba(225,29,46,.24)}.pricing-foot{display:flex;justify-content:space-between;gap:20px;margin-top:22px;font-size:9px;font-weight:900;letter-spacing:.1em;color:#858b91;text-transform:uppercase}.pricing-foot a{color:var(--dm-ink)}.pricing-foot i{margin-left:5px}
/* ---------- pricing: catalogue-driven grid (index.html #plans-grid) ----------
   The pricing cards are built from api/offers.php, so the number of cards
   follows the catalogue. The base rule is a 3-column grid, which left the
   4th offer on its own row; four equal columns keep the section balanced.
   .pricing-loading is the state before the fetch resolves, and the state kept
   if it fails: a plain link to packs.php, never a second hard-coded price. */
#plans-grid{grid-template-columns:repeat(4,1fr)}
#plans-grid .pricing-loading{grid-column:1/-1;margin:0;padding:26px 0}
#plans-grid .pricing-loading a{display:inline-flex;align-items:center;gap:10px;font-size:11px;font-weight:850;letter-spacing:.06em;color:var(--dm-ink)}
#plans-grid .pricing-loading i{margin-left:0}
@media(max-width:1100px){#plans-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:820px){#plans-grid{grid-template-columns:1fr}}

/* A restrained pointer-following tilt for catalogue cards on the homepage. */
#plans-grid .dm-price-card{
  --price-tilt-x:0deg;--price-tilt-y:0deg;--price-light-x:50%;--price-light-y:0%;
  overflow:visible;transform-style:preserve-3d;will-change:transform;
  transform:perspective(1100px) rotateX(var(--price-tilt-x)) rotateY(var(--price-tilt-y)) translate3d(0,22px,0);
  transition:opacity .72s var(--dm-ease),transform .52s var(--dm-ease),box-shadow .42s var(--dm-ease),border-color .32s ease,background-color .45s var(--dm-ease),color .32s var(--dm-ease);
}
#plans-grid .dm-price-card.is-visible{
  transform:perspective(1100px) rotateX(var(--price-tilt-x)) rotateY(var(--price-tilt-y)) translate3d(0,0,0);
}
#plans-grid .dm-price-card::before{
  content:"";position:absolute;inset:0;z-index:0;border-radius:inherit;pointer-events:none;opacity:0;
  background:radial-gradient(circle at var(--price-light-x) var(--price-light-y),rgba(255,255,255,.58),transparent 58%);
  transition:opacity .28s ease;
}
#plans-grid .dm-price-card.popular::before{
  background:radial-gradient(circle at var(--price-light-x) var(--price-light-y),rgba(239,35,60,.22),transparent 60%);
}
#plans-grid .dm-price-card>:not(.popular-badge){position:relative;z-index:1;transform:translateZ(12px)}
#plans-grid .dm-price-card .popular-badge{z-index:2;transform:translateZ(20px)}
#plans-grid .dm-price-card:hover,
#plans-grid .dm-price-card:focus-within{
  transform:perspective(1100px) rotateX(var(--price-tilt-x)) rotateY(var(--price-tilt-y)) translate3d(0,-8px,0);
  box-shadow:0 34px 76px rgba(20,23,28,.17);border-color:rgba(225,29,46,.2);
}
#plans-grid .dm-price-card:hover::before,
#plans-grid .dm-price-card:focus-within::before{opacity:1}
#plans-grid .dm-price-card.popular{
  transform:perspective(1100px) rotateX(var(--price-tilt-x)) rotateY(var(--price-tilt-y)) translate3d(0,-10px,0);
}
#plans-grid .dm-price-card.popular:not(.is-visible){
  transform:perspective(1100px) rotateX(var(--price-tilt-x)) rotateY(var(--price-tilt-y)) translate3d(0,22px,0);
}
#plans-grid .dm-price-card.popular.is-visible{
  transform:perspective(1100px) rotateX(var(--price-tilt-x)) rotateY(var(--price-tilt-y)) translate3d(0,-10px,0);
}
#plans-grid .dm-price-card.popular:hover,
#plans-grid .dm-price-card.popular:focus-within{
  transform:perspective(1100px) rotateX(var(--price-tilt-x)) rotateY(var(--price-tilt-y)) translate3d(0,-15px,0);
  box-shadow:0 38px 82px rgba(16,18,22,.25),0 16px 42px rgba(225,29,46,.14);
  border-color:rgba(225,29,46,.42);
}
#plans-grid .dm-price-card:nth-child(odd):hover,
#plans-grid .dm-price-card:nth-child(odd):focus-within{--price-tilt-x:2deg;--price-tilt-y:-2.4deg;--price-light-x:28%;--price-light-y:16%}
#plans-grid .dm-price-card:nth-child(even):hover,
#plans-grid .dm-price-card:nth-child(even):focus-within{--price-tilt-x:2deg;--price-tilt-y:2.4deg;--price-light-x:72%;--price-light-y:16%}
#plans-grid .dm-price-card>.price-action:hover{transform:translateZ(16px) translateY(-2px)}
@media(max-width:820px){
  #plans-grid .dm-price-card.popular,
  #plans-grid .dm-price-card.popular.is-visible{transform:perspective(1100px) rotateX(var(--price-tilt-x)) rotateY(var(--price-tilt-y)) translate3d(0,0,0)}
  #plans-grid .dm-price-card.popular:hover,
  #plans-grid .dm-price-card.popular:focus-within{transform:perspective(1100px) rotateX(var(--price-tilt-x)) rotateY(var(--price-tilt-y)) translate3d(0,-6px,0)}
}
@media(hover:none){
  #plans-grid .dm-price-card:hover,
  #plans-grid .dm-price-card.popular:hover{transform:perspective(1100px) rotateX(0) rotateY(0) translate3d(0,0,0)}
  #plans-grid .dm-price-card.popular,
  #plans-grid .dm-price-card.popular.is-visible{transform:perspective(1100px) rotateX(0) rotateY(0) translate3d(0,0,0)}
}
@media(prefers-reduced-motion:reduce){
  #plans-grid .dm-price-card,
  #plans-grid .dm-price-card.is-visible,
  #plans-grid .dm-price-card:hover,
  #plans-grid .dm-price-card:focus-within,
  #plans-grid .dm-price-card.popular,
  #plans-grid .dm-price-card.popular.is-visible,
  #plans-grid .dm-price-card.popular:hover,
  #plans-grid .dm-price-card.popular:focus-within{transform:none;transition:none;will-change:auto}
  #plans-grid .dm-price-card>:not(.popular-badge){transform:none}
}

/* ---------- light-mode offer cards take the dark accent on hover ----------
   In dark mode the dark cards already answer the pointer with the red accent
   (see packs-page.css). In light mode the white cards stayed flat. On hover and
   on keyboard focus they now take the same anthracite surface as the featured
   card, with the red border and a soft depth shadow, and every label inside is
   re-coloured so it stays perfectly legible.

   Scoped to the two catalogues that actually render .dm-price-card (the packs
   page and the homepage ladder), to :not(.popular) so the featured card keeps
   its own dark treatment, and to html:not(.dark) so dark mode is untouched.
   Only real hover devices are affected, so no artificial hover sticks after a
   tap on a touch screen. */
@media (hover: hover) {
  html:not(.dark) :is(#plans-grid, .dm-pricing-page) .dm-price-card:not(.popular):hover,
  html:not(.dark) :is(#plans-grid, .dm-pricing-page) .dm-price-card:not(.popular):focus-within {
    background-color: var(--dm-dark-2);
    border-color: rgba(225, 29, 46, .42);
    box-shadow: 0 34px 76px rgba(16, 18, 22, .30), 0 16px 42px rgba(225, 29, 46, .16);
    color: #fff;
  }
  html:not(.dark) :is(#plans-grid, .dm-pricing-page) .dm-price-card:not(.popular):hover::before,
  html:not(.dark) :is(#plans-grid, .dm-pricing-page) .dm-price-card:not(.popular):focus-within::before {
    background: radial-gradient(circle at var(--price-light-x) var(--price-light-y), rgba(239, 35, 60, .22), transparent 60%);
  }
  html:not(.dark) :is(#plans-grid, .dm-pricing-page) .dm-price-card:not(.popular):hover>p,
  html:not(.dark) :is(#plans-grid, .dm-pricing-page) .dm-price-card:not(.popular):focus-within>p { color: #b1b7bf; }
  html:not(.dark) :is(#plans-grid, .dm-pricing-page) .dm-price-card:not(.popular):hover li,
  html:not(.dark) :is(#plans-grid, .dm-pricing-page) .dm-price-card:not(.popular):focus-within li { color: #d1d5da; }
  html:not(.dark) :is(#plans-grid, .dm-pricing-page) .dm-price-card:not(.popular):hover li i.fa-check,
  html:not(.dark) :is(#plans-grid, .dm-pricing-page) .dm-price-card:not(.popular):focus-within li i.fa-check { color: #8bd0ac; }
  html:not(.dark) :is(#plans-grid, .dm-pricing-page) .dm-price-card:not(.popular):hover li i.fa-xmark,
  html:not(.dark) :is(#plans-grid, .dm-pricing-page) .dm-price-card:not(.popular):focus-within li i.fa-xmark { color: #9aa2ab; }
  html:not(.dark) :is(#plans-grid, .dm-pricing-page) .dm-price-card:not(.popular):hover .price-head,
  html:not(.dark) :is(#plans-grid, .dm-pricing-page) .dm-price-card:not(.popular):hover .price span,
  html:not(.dark) :is(#plans-grid, .dm-pricing-page) .dm-price-card:not(.popular):focus-within .price-head,
  html:not(.dark) :is(#plans-grid, .dm-pricing-page) .dm-price-card:not(.popular):focus-within .price span { color: #9aa2ab; }
  /* Same red call-to-action as the featured card, so the button never sinks
     into the darker surface. */
  html:not(.dark) :is(#plans-grid, .dm-pricing-page) .dm-price-card:not(.popular):hover>.price-action,
  html:not(.dark) :is(#plans-grid, .dm-pricing-page) .dm-price-card:not(.popular):focus-within>.price-action {
    background: var(--dm-red);
    color: #fff;
    box-shadow: 0 13px 28px rgba(225, 29, 46, .24);
  }
  /* The option picker, the duration note and its hint only exist on packs.php;
     these selectors are inert on the homepage. */
  html:not(.dark) .dm-pricing-page .dm-price-card:not(.popular):hover .premium-picker-option,
  html:not(.dark) .dm-pricing-page .dm-price-card:not(.popular):focus-within .premium-picker-option { border-color: rgba(255, 255, 255, .18); }
  html:not(.dark) .dm-pricing-page .dm-price-card:not(.popular):hover .packs-note,
  html:not(.dark) .dm-pricing-page .dm-price-card:not(.popular):focus-within .packs-note,
  html:not(.dark) .dm-pricing-page .dm-price-card:not(.popular):hover .premium-picker-hint,
  html:not(.dark) .dm-pricing-page .dm-price-card:not(.popular):focus-within .premium-picker-hint { color: #a0a8b2 !important; }
}
/* Fade the text colours in step with the surface, so light text never lands on
   a still-light card. :where() keeps specificity at zero, so it cannot disturb
   any transition a child already declares (.price-action, the picker options). */
html:not(.dark) :is(#plans-grid, .dm-pricing-page) .dm-price-card:not(.popular) :where(p, li, .price-head, .price span, .premium-picker-hint, .packs-note) {
  transition: color .32s var(--dm-ease);
}

/* ---------- closing ---------- */
.dm-closing{position:relative;min-height:570px;display:grid;place-items:center;overflow:hidden;background:linear-gradient(140deg,#101216,#171a20)}.dm-closing::before,.dm-closing::after{content:"";position:absolute;border-radius:50%;filter:blur(2px)}.dm-closing::before{width:620px;height:620px;left:-180px;bottom:-370px;background:radial-gradient(circle,rgba(225,29,46,.17),transparent 68%)}.dm-closing::after{width:560px;height:560px;right:-230px;top:-290px;background:radial-gradient(circle,rgba(199,161,58,.14),transparent 67%)}.closing-grid{position:absolute;inset:0;opacity:.15;background-image:linear-gradient(rgba(255,255,255,.11) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.11) 1px,transparent 1px);background-size:44px 44px;mask-image:radial-gradient(circle at center,#000,transparent 78%)}.closing-inner{position:relative;z-index:2;text-align:center;color:#fff}.closing-inner .dm-section-index{color:#7f8791}.closing-inner h2{font-size:clamp(3.7rem,6.5vw,7rem);margin-bottom:24px}.closing-inner p{max-width:520px;margin:0 auto;color:#9ea5af;font-size:14px;line-height:1.8}.dm-primary-action.light{margin-top:27px;background:#fff;color:var(--dm-ink)}
/* ---------- footer ---------- */
.dm-footer{background:#0b0d11;color:#fff;padding:62px 0 22px}.footer-main{display:flex;justify-content:space-between;gap:60px;padding-bottom:45px;border-bottom:1px solid rgba(255,255,255,.08)}.footer-brand{max-width:360px}.footer-brand .dm-brand-mark{background:#16191e;border-color:rgba(255,255,255,.08)}.footer-brand p{color:#7d858f;font-size:12px;line-height:1.8;margin:18px 0 0}.footer-cols{display:grid;grid-template-columns:repeat(3,150px);gap:28px}.footer-cols div{display:grid;gap:9px;align-content:start}.footer-cols strong{font-size:10px;text-transform:uppercase;letter-spacing:.12em;color:#fff;margin-bottom:6px}.footer-cols a{font-size:11px;color:#777f89;transition:.2s}.footer-cols a:hover{color:#fff}.footer-bottom{display:flex;justify-content:space-between;padding-top:20px;gap:20px;color:#5d6670;font-size:9px;font-weight:850;letter-spacing:.12em;text-transform:uppercase}
/* Light theme: same root cause as .sp-footer above — the footer stays dark in both
   themes, yet the shared .dm-brand wordmark becomes near-black in light mode (ink
   meant for the light navbar). Footer-scoped override, html:not(.dark) only, so dark
   mode keeps its current look. !important only to beat the shared navbar rule. */
html:not(.dark) .dm-footer .dm-brand,
html:not(.dark) .dm-footer .dm-brand-word{color:#f5f6f8!important}
html:not(.dark) .footer-brand .dm-brand-mark{background:#fff;border-color:rgba(16,18,22,.08)}
html:not(.dark) .footer-brand p{color:#a9b0b8}
/* ---------- shared old pages ---------- */
.global-top-nav,nav.fixed{background:rgba(251,250,247,.88)!important;border-bottom:1px solid var(--dm-line)!important;box-shadow:0 10px 32px rgba(16,18,22,.06)!important;backdrop-filter:blur(18px)!important}.global-nav-inner{max-width:1320px!important}.global-nav-brand .brand-text{background:none!important;-webkit-text-fill-color:initial!important;color:var(--dm-ink)!important}.global-nav-links a{border-radius:12px!important}.global-nav-links a.nav-register,nav.fixed a[href="register.php"]{background:var(--dm-ink)!important;color:#fff!important;border-radius:12px!important;box-shadow:none!important}.global-nav-links a:hover,nav.fixed a:hover{transform:translateY(-1px)}.card,.auth-card,.content-card,.comparison,.section-card,.teil3-header-card,.teil3-choice-card,.pack-card{border-radius:24px!important;box-shadow:var(--dm-shadow-sm)!important}.btn,.btn-pack,.btn-primary,.btn-outline,.btn-whatsapp{border-radius:13px!important}.page-header h1,.auth-header h1,.card h2,.comparison h2,.section h2{font-family:"Space Grotesk",sans-serif!important;letter-spacing:-.045em!important}
.dm-reveal{opacity:0;transform:translateY(25px);transition:opacity .8s var(--dm-ease),transform .8s var(--dm-ease)}.dm-reveal.is-visible{opacity:1;transform:none}
html.dark body{background:#101318;color:#f7f7f5}.dark .dm-topbar{background:rgba(16,19,24,.78);border-bottom-color:rgba(255,255,255,.07)}html.dark .dm-topbar.scrolled{background:rgba(16,19,24,.94)}html.dark .dm-main-nav a,html.dark .dm-text-link,html.dark .dm-circle-btn{color:#b9c0c8}html.dark .dm-main-nav a:hover,html.dark .dm-circle-btn:hover{background:#1d2229;color:#fff}.dark .dm-mobile-menu{background:#101318;border-top-color:rgba(255,255,255,.08)}.dark .dm-mobile-menu a{color:#c1c7cf}.dark .dm-hero,.dark .dm-levels,.dark .dm-method,.dark .dm-pricing{background:#111419}.dark .dm-level-card{color:#fff}.dark .dm-level-card,.dark .dm-price-card{border-color:rgba(255,255,255,.08)}.dark .dm-price-card{background:#181c22}.dark .dm-price-card>p,.dark .dm-price-card li,.dark .dm-section-intro p,.dark .dm-method-left>p{color:#929aa4}
html.dark .dm-home .dm-cockpit-side,html.dark .dm-home .dm-cockpit-chart{background:rgba(255,255,255,.055);border-color:rgba(255,255,255,.08)}
html.dark .dm-home .dm-cockpit-top,html.dark .dm-home .chart-head,html.dark .dm-home .side-label{color:#98a1aa}
html.dark .dm-home .side-sub,html.dark .dm-home .side-percent{color:#aab1b8}
html.dark .dm-home .side-progress{background:rgba(255,255,255,.12)}
html.dark .dm-home .dm-float-chip{background:rgba(20,24,30,.92);border-color:rgba(255,255,255,.10);box-shadow:0 18px 35px rgba(0,0,0,.4)}
@media(max-width:1100px){.dm-main-nav{margin-left:0}.dm-hero-layout{grid-template-columns:1fr}.dm-hero-copy{text-align:center}.dm-hero-copy .dm-hero-lead{margin-inline:auto}.dm-hero-actions,.dm-hero-metrics{justify-content:center}.dm-hero-stage{min-height:560px;order:-1}.dm-section-intro,.dm-method-grid{grid-template-columns:1fr}.dm-method-grid{gap:40px}.dm-bento-grid{grid-template-columns:1fr 1fr}.bento-large{grid-row:span 2}.dm-trust-inner{overflow:auto;justify-content:flex-start}.trust-copy{min-width:max-content}}
@media(max-width:820px){.dm-main-nav,.dm-text-link{display:none}.dm-menu-btn{display:grid}.dm-shell{width:min(100% - 30px,1320px)}.dm-hero{min-height:0}.dm-hero-layout{min-height:0;padding:70px 0 85px}.dm-hero h1{font-size:clamp(3.5rem,15vw,6rem)}.dm-hero-metrics{gap:20px}.dm-hero-stage{min-height:470px}.dm-cockpit{width:98%;padding:14px}.dm-cockpit-main{grid-template-columns:1fr}.dm-cockpit-chart{display:none}.dm-cockpit-side>strong{font-size:4.4rem}.dm-cockpit-bottom{grid-template-columns:1fr}.chip-level{right:-4%;top:10%}.chip-score{left:-4%;bottom:22%}.chip-telc{right:0;bottom:7%}.dm-section{padding:88px 0}.dm-section-intro{margin-bottom:38px}.dm-levels-layout,.dm-pricing-grid{grid-template-columns:1fr}.dm-level-card{min-height:530px}.dm-price-card.popular,.dm-price-card.popular:hover{transform:none}.dm-bento-grid{grid-template-columns:1fr;grid-auto-rows:290px}.bento-large{grid-row:auto;min-height:380px}.footer-main{flex-direction:column;gap:35px}.dm-footer{padding-top:50px}.footer-bottom{flex-direction:column}}
@media(max-width:520px){.dm-home{padding-top:72px}.dm-topbar{height:72px}.dm-brand-word{display:none}.dm-top-actions .telc-lang-mount{transform:scale(.9);transform-origin:right center}.dm-header-cta{padding:11px 12px}.dm-header-cta i{display:none}.dm-hero-copy{padding:35px 0}.dm-hero-lead{font-size:14px}.dm-hero-actions{flex-direction:column;align-items:stretch}.dm-primary-action,.dm-secondary-action{width:100%}.dm-secondary-action{justify-content:center}.dm-hero-metrics{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:35px}.dm-hero-stage{min-height:385px}.dm-cockpit{transform:rotateY(-8deg) rotateX(4deg) rotateZ(-1deg)}.dm-cockpit-side{padding:18px}.dm-cockpit-side>strong{font-size:3.6rem}.lesson-row{padding:10px}.lesson-row strong{font-size:10px}.level-big{font-size:10rem}.level-shape{width:75%;height:31%;top:23%}.dm-bento-grid{grid-auto-rows:250px}.bento-large{min-height:340px}.practice-visual{width:95px;height:95px}.footer-cols{grid-template-columns:1fr 1fr}.footer-cols div:last-child{grid-column:1/-1}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important;scroll-behavior:auto!important}}
/* Keep the new homepage full-bleed below the fixed bar. */
body.dm-home{padding-top:84px!important}
@media(max-width:520px){body.dm-home{padding-top:72px!important}}


/* ===== Deutschmaak — Experience section V3 / editorial bento system ===== */
.dm-experience-pro{isolation:isolate;background:radial-gradient(circle at 74% 17%,rgba(225,29,46,.13),transparent 23%),radial-gradient(circle at 12% 83%,rgba(199,161,58,.07),transparent 24%),linear-gradient(180deg,#0d1014 0%,#101319 100%)}
.dm-experience-pro::after{content:"";position:absolute;inset:0;pointer-events:none;opacity:.18;background-image:linear-gradient(rgba(255,255,255,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.035) 1px,transparent 1px);background-size:52px 52px;mask-image:linear-gradient(180deg,#000,transparent 82%);z-index:-1}
.dm-experience-noise{position:absolute;inset:0;pointer-events:none;opacity:.055;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140' viewBox='0 0 140 140'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.5'/%3E%3C/svg%3E")}
.dm-experience-orb{position:absolute;border-radius:50%;filter:blur(1px);pointer-events:none;z-index:-1}.orb-one{width:620px;height:620px;right:-310px;top:120px;background:radial-gradient(circle,rgba(225,29,46,.18),transparent 66%);animation:dmOrbFloat 10s ease-in-out infinite}.orb-two{width:420px;height:420px;left:-230px;bottom:40px;background:radial-gradient(circle,rgba(255,255,255,.05),transparent 68%);animation:dmOrbFloat 13s ease-in-out infinite reverse}@keyframes dmOrbFloat{50%{transform:translate3d(0,-18px,0) scale(1.04)}}
.dm-experience-intro{align-items:end}.dm-intro-side{max-width:430px;display:flex;flex-direction:column;gap:18px}.dm-intro-pills{display:flex;gap:8px;flex-wrap:wrap}.dm-intro-pills span{display:inline-flex;align-items:center;gap:7px;padding:8px 11px;border:1px solid rgba(255,255,255,.08);background:rgba(255,255,255,.03);border-radius:999px;font-size:9px;font-weight:850;letter-spacing:.08em;text-transform:uppercase;color:#aab1ba}.dm-intro-pills i{font-size:9px;color:#e7e8ea}
.dm-bento-pro{grid-template-columns:1.28fr .66fr .66fr;grid-auto-rows:270px;gap:15px}.dm-bento-pro .bento{padding:25px;border-radius:28px;border:1px solid rgba(255,255,255,.08);background:linear-gradient(155deg,rgba(28,32,39,.98),rgba(13,16,20,.98));box-shadow:0 14px 44px rgba(0,0,0,.12),inset 0 1px 0 rgba(255,255,255,.025);transform-style:preserve-3d}.dm-bento-pro .bento::before{content:"";position:absolute;inset:-30% -10% auto;height:140px;background:radial-gradient(circle,rgba(255,255,255,.05),transparent 72%);transform:translateZ(-1px);pointer-events:none}.dm-bento-pro .bento:hover{border-color:rgba(255,255,255,.18);box-shadow:0 30px 80px rgba(0,0,0,.28),0 0 0 1px rgba(255,255,255,.03) inset}.dm-bento-pro .bento-red{background:linear-gradient(145deg,#f02b3d 0%,#c81729 44%,#9d1321 100%);box-shadow:0 24px 68px rgba(225,29,46,.18)}.dm-bento-pro .bento-red:hover{box-shadow:0 34px 90px rgba(225,29,46,.24)}
.bento-glow{position:absolute;width:250px;height:250px;right:-80px;top:-110px;border-radius:50%;background:radial-gradient(circle,rgba(255,255,255,.07),transparent 68%);pointer-events:none}.bento-cursor{position:absolute;right:12%;top:41%;transform:translateZ(40px) rotate(-13deg);width:28px;height:32px;display:grid;place-items:center;color:#fff;filter:drop-shadow(0 8px 12px rgba(0,0,0,.35));animation:dmCursorFloat 4s ease-in-out infinite}.bento-cursor span{position:absolute;width:34px;height:34px;border-radius:50%;background:rgba(225,29,46,.16);box-shadow:0 0 0 5px rgba(225,29,46,.07);animation:dmCursorPulse 2.3s ease-in-out infinite}.bento-cursor i{position:relative;z-index:2;font-size:27px}@keyframes dmCursorFloat{50%{transform:translate3d(4px,-4px,40px) rotate(-9deg)}}@keyframes dmCursorPulse{50%{transform:scale(1.18);opacity:.65}}
.bento-copy-pro{bottom:24px}.bento-copy-kicker{display:flex;align-items:center;gap:7px;margin-bottom:7px;font-size:8px;font-weight:900;letter-spacing:.15em;text-transform:uppercase;color:#7e8791}.bento-red .bento-copy-kicker{color:#ffd6db}.bento-copy-kicker span{width:7px;height:7px;border-radius:50%;background:#9fa8b2;box-shadow:0 0 0 4px rgba(159,168,178,.07)}.bento-red .bento-copy-kicker span{background:#fff;box-shadow:0 0 0 4px rgba(255,255,255,.08)}.bento-copy-pro h3{font-size:1.68rem;margin-bottom:8px}.bento-copy-pro p{font-size:11.5px;line-height:1.65;max-width:520px}
.dashboard-pro{left:25px;right:25px;top:69px;height:310px;border-radius:22px;border:1px solid rgba(255,255,255,.09);background:#0b0e12;box-shadow:0 22px 55px rgba(0,0,0,.22),inset 0 1px 0 rgba(255,255,255,.03);overflow:hidden}.mini-window-head{height:35px;display:flex;align-items:center;justify-content:space-between;padding:0 14px;border-bottom:1px solid rgba(255,255,255,.06);background:linear-gradient(180deg,#171b20,#12151a)}.mini-brand{display:flex;align-items:center;gap:8px;color:#cfd3d8;font-size:8px}.mini-brand strong{font-size:8px;letter-spacing:.02em}.mini-logo{width:18px;height:18px;border-radius:5px;display:grid;place-items:center;background:linear-gradient(135deg,#fff,#cfd2d6);color:#171a1f;font-family:"Space Grotesk";font-size:8px;font-weight:900}.mini-window-actions{display:flex;gap:4px}.mini-window-actions span{width:5px;height:5px;border-radius:50%;background:#515964}.mini-window-body{display:grid;grid-template-columns:46px 1fr;height:calc(100% - 35px)}.mini-rail{display:flex;flex-direction:column;gap:9px;align-items:center;padding:14px 0;border-right:1px solid rgba(255,255,255,.05);background:#101319}.mini-rail span{width:24px;height:24px;display:grid;place-items:center;border-radius:7px;color:#626b76;font-size:9px}.mini-rail .rail-active{background:#20262d;color:#fff;box-shadow:inset 0 0 0 1px rgba(255,255,255,.06)}.mini-rail .rail-bottom{margin-top:auto}.mini-content{padding:18px 16px}.mini-welcome{display:flex;justify-content:space-between;gap:16px;align-items:end}.mini-welcome small{display:block;color:#686f79;font-size:7px;font-weight:900;letter-spacing:.12em}.mini-welcome strong{display:block;margin-top:4px;color:#eef0f2;font-size:16px;font-family:"Space Grotesk";letter-spacing:-.045em}.mini-streak{display:inline-flex;align-items:center;gap:6px;padding:7px 9px;border-radius:999px;background:#171b21;color:#aeb6bf;font-size:7px;font-weight:900;border:1px solid rgba(255,255,255,.05)}.mini-streak i{color:#e11d2e}.mini-stat-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:7px;margin-top:14px}.mini-stat-grid>div{padding:11px;border-radius:11px;background:linear-gradient(145deg,#1a1f25,#121519);border:1px solid rgba(255,255,255,.045);min-height:67px;position:relative;overflow:hidden}.mini-stat-grid small{display:block;color:#646d77;text-transform:uppercase;font-size:6px;font-weight:900;letter-spacing:.12em}.mini-stat-grid b{display:block;margin-top:8px;color:#fff;font-family:"Space Grotesk";font-size:13px;letter-spacing:-.03em}.micro-line{display:block;height:3px;border-radius:999px;background:#262c33;margin-top:8px;overflow:hidden}.micro-line i{display:block;height:100%;border-radius:inherit;background:linear-gradient(90deg,#fff,#9098a1)}.stat-red{background:linear-gradient(145deg,#e41e31,#9d1120)!important}.stat-red small,.stat-red b{color:#fff}.stat-red>span{position:absolute;right:11px;bottom:10px;width:18px;height:18px;display:grid;place-items:center;border-radius:50%;background:rgba(255,255,255,.13);font-size:7px;color:#fff}.mini-lower{display:grid;grid-template-columns:1.3fr .7fr;gap:8px;margin-top:8px}.mini-chart-card,.mini-next-card{min-height:112px;border-radius:11px;border:1px solid rgba(255,255,255,.045);background:linear-gradient(145deg,#171c22,#111419);padding:11px}.mini-card-title{display:flex;justify-content:space-between;color:#68717c;font-size:7px}.mini-card-title b{color:#e6e8ea}.mini-bars{height:69px;display:flex;align-items:end;gap:7px;margin-top:9px}.mini-bars i{flex:1;border-radius:5px 5px 2px 2px;background:linear-gradient(180deg,#77808c,#2e343c);box-shadow:0 -6px 17px rgba(255,255,255,.025)}.mini-bars i:last-child{background:linear-gradient(180deg,#f03a4a,#ac1828)}.mini-next-card>small{color:#666f79;font-size:6px;font-weight:900;letter-spacing:.13em}.mini-next-card>div{display:flex;gap:8px;align-items:center;margin-top:14px}.mini-play{width:30px;height:30px;display:grid;place-items:center;border-radius:9px;background:#242a31;color:#fff;font-size:8px}.mini-next-card strong{display:block;color:#eef0f2;font-size:8px}.mini-next-card span:last-child{display:block;margin-top:3px;color:#69727d;font-size:6px}
.bento-practice .bento-meta{position:relative;z-index:4}.bento-red-glow{position:absolute;inset:-30% -20% auto auto;width:270px;height:270px;border-radius:50%;background:radial-gradient(circle,rgba(255,255,255,.20),transparent 66%);filter:blur(2px)}.practice-visual-pro{position:absolute;left:50%;top:62px;transform:translateX(-50%);width:100%;display:flex;flex-direction:column;align-items:center;gap:12px}.score-ring{width:126px;height:126px;border-radius:50%;display:grid;place-items:center;background:conic-gradient(from -50deg,#fff 0 var(--score),rgba(255,255,255,.16) var(--score) 100%);box-shadow:0 15px 40px rgba(61,5,10,.22),inset 0 0 0 1px rgba(255,255,255,.15);position:relative;animation:dmScoreSpin 7s ease-in-out infinite}.score-ring::before{content:"";position:absolute;inset:9px;border-radius:50%;background:linear-gradient(160deg,#d61c2d,#ac1322);box-shadow:inset 0 0 0 1px rgba(255,255,255,.11)}.score-core{position:relative;z-index:2;display:grid;grid-template-columns:auto auto;align-items:end;color:#fff}.score-core strong{font-family:"Space Grotesk";font-size:36px;line-height:.82;letter-spacing:-.07em}.score-core span{font-size:11px;font-weight:900;line-height:1;margin-left:2px}.score-core small{grid-column:1/-1;margin-top:7px;text-align:center;font-size:7px;letter-spacing:.16em;text-transform:uppercase;opacity:.72}.score-caption{display:flex;gap:8px;align-items:center;font-size:8px;font-weight:900;letter-spacing:.11em}.score-caption span{color:#ffd8dc}.score-caption b{padding:6px 8px;border-radius:999px;background:rgba(255,255,255,.12);color:#fff}.practice-skill-list{position:absolute;left:25px;right:25px;top:210px;display:grid;gap:8px}.practice-skill-list span{display:grid;grid-template-columns:18px 70px 1fr;align-items:center;gap:8px;color:#ffdfe2;font-size:8px;font-weight:800}.practice-skill-list i{font-size:8px;opacity:.9}.practice-skill-list b{height:4px;border-radius:999px;background:rgba(255,255,255,.17);position:relative;overflow:hidden}.practice-skill-list b::after{content:"";position:absolute;inset:0 auto 0 0;width:var(--w);background:#fff;border-radius:inherit}.bento-practice .bento-copy{bottom:22px}.bento-practice .bento-copy-pro p{max-width:300px}@keyframes dmScoreSpin{50%{transform:translateX(-50%) rotate(2deg) scale(1.02)}}
.momentum-head{position:absolute;left:25px;right:25px;top:67px;display:flex;align-items:end;justify-content:space-between}.momentum-head small{display:block;font-size:7px;letter-spacing:.14em;color:#67707b;font-weight:900}.momentum-head strong{display:block;margin-top:3px;color:#fff;font-size:28px;font-family:"Space Grotesk";letter-spacing:-.06em}.momentum-head>span{font-size:8px;text-transform:uppercase;letter-spacing:.12em;color:#626b75;font-weight:900}.momentum-head>span b{color:#fff;margin-left:5px}.momentum-chart-pro{position:absolute;left:25px;right:25px;top:118px;height:106px}.momentum-chart-pro svg{width:100%;height:100%;display:block;overflow:visible}.momentum-chart-pro .chart-area{fill:url(#momentumFill)}.momentum-chart-pro .chart-line{fill:none;stroke:#dce1e5;stroke-width:2.5;stroke-linecap:round;stroke-linejoin:round;filter:drop-shadow(0 4px 8px rgba(255,255,255,.08))}.momentum-chart-pro .chart-dot{fill:#e11d2e;stroke:#fff;stroke-width:2}.chart-gridlines{position:absolute;inset:12px 0 6px;display:flex;flex-direction:column;justify-content:space-between;pointer-events:none}.chart-gridlines i{display:block;height:1px;background:rgba(255,255,255,.045)}.momentum-labels{position:absolute;left:25px;right:25px;top:225px;display:flex;justify-content:space-between;color:#5f6772;font-size:7px;font-weight:800}
.device-scene{position:absolute;inset:55px 25px 100px;perspective:900px}.device-laptop{position:absolute;left:4%;right:7%;top:20px;transform:rotateX(62deg) rotateZ(-3deg);transform-origin:center bottom;filter:drop-shadow(0 24px 24px rgba(0,0,0,.32));opacity:.72}.laptop-screen{height:92px;border-radius:10px 10px 5px 5px;background:#0a0d11;border:5px solid #2a3037;overflow:hidden;padding:8px}.screen-bar{display:block;width:32%;height:6px;border-radius:3px;background:#343b44}.screen-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:5px;margin-top:8px}.screen-grid i{height:22px;border-radius:4px;background:#1f252c}.screen-grid i:nth-child(3){background:#bd1828}.screen-grid b{grid-column:1/-1;height:28px;border-radius:4px;background:#191f25}.laptop-base{height:13px;margin:0 5%;border-radius:0 0 10px 10px;background:linear-gradient(180deg,#343a42,#20252b)}.device-phone{position:absolute;right:14%;bottom:0;width:80px;height:142px;border-radius:19px;background:#080a0d;border:6px solid #2a3038;transform:rotateY(-9deg) rotateX(3deg) rotateZ(3deg);box-shadow:0 26px 40px rgba(0,0,0,.45);padding:8px;animation:dmPhoneFloat 5s ease-in-out infinite}.phone-camera{width:23px;height:4px;border-radius:0 0 5px 5px;background:#252b32;margin:0 auto 7px}.phone-screen{height:100%;border-radius:11px;background:linear-gradient(160deg,#141922,#0c0f14);padding:9px;display:flex;flex-direction:column;gap:6px}.phone-screen span{width:52%;height:5px;border-radius:4px;background:#4b555f}.phone-screen b{display:block;height:45px;border-radius:7px;background:linear-gradient(145deg,#e41e31,#99121f)}.phone-screen i{height:6px;border-radius:4px;background:#303740}.device-float{position:absolute;right:2%;top:12%;padding:8px 10px;border-radius:999px;background:#f5f3ef;color:#121519;font-size:8px;font-weight:900;box-shadow:0 14px 28px rgba(0,0,0,.28);animation:dmFloatBadge 4.4s ease-in-out infinite}.device-float i{color:#e11d2e;margin-right:4px}@keyframes dmPhoneFloat{50%{transform:translate3d(-3px,-8px,0) rotateY(-9deg) rotateX(4deg) rotateZ(3deg)}}@keyframes dmFloatBadge{50%{transform:translateY(-5px)}}
@media(max-width:1100px){.dm-bento-pro{grid-template-columns:1fr 1fr}.dm-bento-pro .bento-large{grid-row:span 2;grid-column:1/-1}.dm-intro-side{max-width:100%}}
@media(max-width:820px){.dm-bento-pro{grid-template-columns:1fr;grid-auto-rows:300px}.dm-bento-pro .bento-large{grid-column:auto;grid-row:span 1;min-height:525px}.dashboard-pro{height:245px}.dm-bento-pro .bento-practice,.dm-bento-pro .bento-momentum,.dm-bento-pro .bento-device{min-height:300px}.mini-lower{grid-template-columns:1fr}.mini-next-card{display:none}.device-scene{inset:50px 22px 92px}.practice-visual-pro{top:64px}.practice-skill-list{top:205px}}
@media(max-width:540px){.dm-intro-pills{gap:6px}.dm-intro-pills span{font-size:8px;padding:7px 9px}.dm-bento-pro .bento{padding:20px;border-radius:22px}.dm-bento-pro .bento-large{min-height:470px}.dashboard-pro{left:18px;right:18px;top:64px;height:220px}.mini-window-head{padding:0 10px}.mini-window-body{grid-template-columns:34px 1fr}.mini-rail{padding-top:10px;gap:6px}.mini-rail span{width:20px;height:20px}.mini-content{padding:12px}.mini-welcome strong{font-size:13px}.mini-stat-grid{gap:5px;margin-top:10px}.mini-stat-grid>div{padding:8px;min-height:58px}.mini-stat-grid b{font-size:11px}.mini-lower{display:none}.bento-copy-pro{bottom:18px}.bento-copy-pro h3{font-size:1.42rem}.bento-copy-pro p{font-size:10.5px}.bento-cursor{right:9%;top:41%}.momentum-chart-pro{top:114px}.momentum-labels{top:220px}.device-phone{right:17%}.device-laptop{left:0;right:8%}}

/* Shared legacy component finishing: same compact cards, touch targets and focus. */
.global-top-nav,nav.fixed{background:rgba(246,247,249,.90)!important}
.card,.auth-card,.content-card,.comparison,.section-card,.teil3-header-card,.teil3-choice-card,.pack-card{border-radius:16px!important}
.btn,.btn-pack,.btn-primary,.btn-outline,.btn-whatsapp{min-height:44px;border-radius:12px!important}
:focus-visible{outline:2px solid var(--dm-red);outline-offset:2px}
@media(max-width:760px){.btn,.btn-pack,.btn-primary,.btn-outline,.btn-whatsapp{min-height:48px}.global-nav-links a{min-height:44px}}
html.dark .global-top-nav,html.dark nav.fixed{background:rgba(16,19,24,.92)!important;border-bottom-color:rgba(255,255,255,.08)!important}
@media(max-width:820px){.global-top-nav .global-nav-links{background:rgba(246,247,249,.98)}html.dark .global-top-nav .global-nav-links{background:rgba(16,19,24,.98)}}
html.dark .global-top-nav,html.dark nav.fixed{background:rgba(16,19,24,.92)!important;border-bottom-color:rgba(255,255,255,.08)!important}
