/* ── Variables & Reset (scoped) ─────────────────── */
#tmf8829-content {
–t-ink:#1a1e2e; –t-ink-soft:#4a5068; –t-ink-faint:#8a90a6;
–t-bg:#f6f7fb; –t-bg-card:#ffffff;
–t-blue:#2563eb; –t-blue-deep:#1e3a5f; –t-blue-light:#eff6ff;
–t-teal:#0d9488; –t-teal-light:#f0fdfa;
–t-amber:#d97706; –t-amber-light:#fffbeb;
–t-red:#dc2626; –t-red-light:#fef2f2;
–t-green:#16a34a; –t-green-light:#f0fdf4;
–t-purple:#7c3aed; –t-purple-light:#f5f3ff;
–t-border:#e2e8f0;
–t-r:12px; –t-r-sm:8px;
font-size:15px;
}
#tmf8829-content *,
#tmf8829-content *::before,
#tmf8829-content *::after {
box-sizing:border-box;
}
/* ── Hero Banner (adapted for WP: not full-screen) ── */
#tmf8829-content .hero{
display:flex;
align-items:center;
justify-content:center;
background:linear-gradient(160deg,#0c1629 0%,#16305c 40%,#1d4787 70%,#2563eb 100%);
position:relative;
overflow:hidden;
padding:80px 40px 60px;
margin-top:-20px;
margin-left:-36px;
margin-right:-36px;
}
@media(max-width:782px){
#tmf8829-content .hero{margin-left:calc(-1 * max(24px,2.5vw));margin-right:calc(-1 * max(24px,2.5vw));padding:50px 24px 40px;}
}
#tmf8829-content .hero::before{
content:”;
position:absolute;inset:0;
background-image:
radial-gradient(circle at 20% 50%,rgba(13,148,136,.12),transparent 50%),
radial-gradient(circle at 80% 30%,rgba(37,99,235,.15),transparent 45%),
linear-gradient(rgba(255,255,255,.02)1px,transparent 1px),
linear-gradient(90deg,rgba(255,255,255,.02)1px,transparent 1px);
background-size:100% 100%,100% 100%,48px 48px,48px 48px;
}
#tmf8829-content .hero::after{
content:”;position:absolute;bottom:-80px;left:50%;
transform:translateX(-50%);width:800px;height:300px;
background:radial-gradient(ellipse,rgba(13,148,136,.18),transparent 70%);
pointer-events:none;
}
#tmf8829-content .hero-content{
position:relative;z-index:1;text-align:center;max-width:840px;margin:0 auto;
}
#tmf8829-content .hero-badge{
display:inline-flex;align-items:center;gap:8px;
background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.12);
border-radius:100px;padding:6px 16px;font-size:.68rem;font-weight:600;
color:rgba(255,255,255,.65);letter-spacing:.08em;text-transform:uppercase;margin-bottom:26px;
}
#tmf8829-content .hero-badge .dot{width:6px;height:6px;border-radius:50%;background:var(–t-teal);box-shadow:0 0 8px var(–t-teal);}
#tmf8829-content .hero h1{
font-size:clamp(2rem,5vw,3.4rem);font-weight:900;color:white;line-height:1.08;letter-spacing:-.03em;margin-bottom:10px;
}
#tmf8829-content .hero h1 em{font-style:normal;background:linear-gradient(135deg,#5eead4,#38bdf8);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;}
#tmf8829-content .hero-sub{font-size:1rem;color:rgba(255,255,255,.55);font-weight:500;letter-spacing:.15em;text-transform:uppercase;margin-bottom:24px;}
#tmf8829-content .hero-desc{font-size:1.06rem;color:rgba(255,255,255,.72);max-width:540px;margin:0 auto 38px;line-height:1.9;font-weight:300;}
#tmf8829-content .hero-stats{
display:flex;gap:0;background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.08);
border-radius:var(–t-r);overflow:hidden;backdrop-filter:blur(10px);flex-wrap:wrap;
}
#tmf8829-content .stat-item{flex:1;padding:18px 16px;border-right:1px solid rgba(255,255,255,.07);text-align:center;min-width:120px;}
#tmf8829-content .stat-item:last-child{border-right:none;}
#tmf8829-content .stat-num{font-size:clamp(1.5rem,3vw,2.1rem);font-weight:800;color:white;line-height:1;margin-bottom:4px;}
#tmf8829-content .stat-num span{font-size:.85rem;font-weight:500;opacity:.55;margin-left:1px;}
#tmf8829-content .stat-label{font-size:.62rem;color:rgba(255,255,255,.45);letter-spacing:.07em;line-height:1.3;}
/* ── Page Wrap ─────────────────────────────── */
#tmf8829-content .page-wrap{max-width:980px;margin:0 auto;padding:72px 0;}
@media(max-width:768px){#tmf8829-content .page-wrap{padding:40px 0;}}
/* ── Section Headers ───────────────────────── */
#tmf8829-content .section-eyebrow{font-size:.66rem;font-weight:700;color:var(–t-blue);letter-spacing:.16em;text-transform:uppercase;margin-bottom:10px;display:flex;align-items:center;gap:8px;}
#tmf8829-content .section-eyebrow::before{content:”;width:20px;height:2px;background:var(–t-blue);border-radius:2px;}
#tmf8829-content .section-heading{font-size:clamp(1.6rem,3vw,2.4rem);font-weight:900;letter-spacing:-.025em;line-height:1.18;color:var(–t-ink);margin-bottom:16px;}
#tmf8829-content .section-heading em{font-style:normal;color:var(–t-teal);}
#tmf8829-content .section-lead{font-size:1rem;color:var(–t-ink-soft);max-width:600px;line-height:1.88;margin-bottom:48px;}
/* ── Story Scenes ─────────────────────────── */
#tmf8829-content .story-scene{display:grid;grid-template-columns:1fr 1fr;gap:44px;align-items:center;margin-bottom:56px;}
@media(max-width:768px){#tmf8829-content .story-scene{grid-template-columns:1fr;gap:28px;}}
#tmf8829-content .story-scene.reverse{direction:rtl;}
#tmf8829-content .story-scene.reverse > *{direction:ltr;}
#tmf8829-content .scene-chapter{font-size:.62rem;font-weight:700;color:var(–t-ink-faint);letter-spacing:.18em;text-transform:uppercase;margin-bottom:8px;}
#tmf8829-content .scene-title{font-size:clamp(1.2rem,2.5vw,1.5rem);font-weight:800;letter-spacing:-.02em;line-height:1.25;color:var(–t-ink);margin-bottom:12px;}
#tmf8829-content .scene-title em{font-style:normal;color:var(–t-blue);}
#tmf8829-content .scene-body{font-size:.9rem;color:var(–t-ink-soft);line-height:1.86;margin-bottom:10px;}
/* ── Graphics ─────────────────────────────── */
#tmf8829-content .graphic-fov{background:linear-gradient(135deg,#162d5a,#1e4080);padding:42px 28px;display:flex;align-items:center;justify-content:center;min-height:240px;border-radius:var(–t-r);}
#tmf8829-content .fov-diagram{position:relative;width:200px;height:200px;}
#tmf8829-content .fov-arc{position:absolute;inset:0;border-radius:50%;border:1.5px solid rgba(255,255,255,.12);}
#tmf8829-content .fov-arc:nth-child(1){transform:scale(.35);border-color:rgba(255,255,255,.35);}
#tmf8829-content .fov-arc:nth-child(2){transform:scale(.55);}
#tmf8829-content .fov-arc:nth-child(3){transform:scale(.75);}
#tmf8829-content .fov-arc:nth-child(4){transform:scale(1);}
#tmf8829-content .fov-center{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:10px;height:10px;border-radius:50%;background:var(–t-teal);box-shadow:0 0 12px var(–t-teal),0 0 24px rgba(13,148,136,.4);}
#tmf8829-content .fov-label{position:absolute;top:10px;right:10px;font-size:1.5rem;font-weight:700;color:white;}
#tmf8829-content .graphic-grid{background:#162d5a;padding:32px 28px;min-height:240px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px;border-radius:var(–t-r);}
#tmf8829-content .grid-row{display:flex;gap:8px;align-items:center;}
#tmf8829-content .grid-label{font-size:.68rem;color:rgba(255,255,255,.45);width:38px;text-align:right;font-weight:600;}
#tmf8829-content .gdot-lg{width:10px;height:10px;border-radius:2px;background:rgba(13,148,136,.4);}
#tmf8829-content .gdot-md{width:5px;height:5px;border-radius:1px;background:#3a6fa8;}
#tmf8829-content .gdot-sm{width:3px;height:3px;border-radius:0;background:#5ec4b6;}
#tmf8829-content .graphic-range{background:linear-gradient(155deg,#0f1b38,#162d5a);padding:32px 28px;min-height:240px;display:flex;flex-direction:column;justify-content:center;gap:12px;border-radius:var(–t-r);}
#tmf8829-content .range-row{display:flex;align-items:center;gap:10px;}
#tmf8829-content .range-label{font-size:.7rem;color:rgba(255,255,255,.5);width:54px;line-height:1.3;}
#tmf8829-content .range-track{flex:1;height:8px;border-radius:100px;background:rgba(255,255,255,.06);overflow:hidden;}
#tmf8829-content .range-val{font-size:.72rem;color:white;font-weight:600;width:32px;text-align:right;}
#tmf8829-content .graphic-power{background:#1a1e2e;padding:32px 28px;min-height:240px;display:flex;flex-direction:column;justify-content:center;gap:14px;border-radius:var(–t-r);}
#tmf8829-content .power-row{display:flex;align-items:center;gap:14px;}
#tmf8829-content .power-label{font-size:.72rem;color:#8a90a6;width:60px;line-height:1.3;}
#tmf8829-content .power-track{flex:1;height:26px;border-radius:6px;background:rgba(255,255,255,.04);overflow:hidden;}
#tmf8829-content .pf-high{width:85%;background:linear-gradient(to right,var(–t-blue),#3a8fd4);height:100%;border-radius:6px;display:flex;align-items:center;padding-left:10px;color:white;font-size:.72rem;font-weight:700;}
#tmf8829-content .pf-mid{width:30%;background:linear-gradient(to right,var(–t-teal),#5ec4b6);height:100%;border-radius:6px;display:flex;align-items:center;padding-left:10px;color:white;font-size:.72rem;font-weight:700;}
#tmf8829-content .pf-low{width:6%;background:#3a4a6b;height:100%;border-radius:6px;display:flex;align-items:center;padding-left:10px;color:rgba(255,255,255,.5);font-size:.64rem;font-weight:700;}
/* ── Mode Cards ───────────────────────────── */
#tmf8829-content .mode-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;}
@media(max-width:768px){#tmf8829-content .mode-grid{grid-template-columns:repeat(2,1fr);}}
@media(max-width:480px){#tmf8829-content .mode-grid{grid-template-columns:1fr;}}
#tmf8829-content .mode-card{background:white;border:1px solid var(–t-border);border-radius:var(–t-r-sm);padding:22px 18px;text-align:center;transition:transform .2s,box-shadow .2s;position:relative;overflow:hidden;}
#tmf8829-content .mode-card::before{content:”;position:absolute;top:0;left:0;right:0;height:3px;}
#tmf8829-content .mode-card.m-blue::before{background:var(–t-blue);}
#tmf8829-content .mode-card.m-teal::before{background:var(–t-teal);}
#tmf8829-content .mode-card.m-amber::before{background:var(–t-amber);}
#tmf8829-content .mode-card.m-red::before{background:var(–t-red);}
#tmf8829-content .mode-card:hover{transform:translateY(-2px);box-shadow:0 8px 28px rgba(0,0,0,.07);}
#tmf8829-content .mode-res{font-size:1.35rem;font-weight:800;}
#tmf8829-content .mode-res.blue{color:var(–t-blue);} #tmf8829-content .mode-res.teal{color:var(–t-teal);} #tmf8829-content .mode-res.amber{color:var(–t-amber)} #tmf8829-content .mode-res.red{color:var(–t-red)}
#tmf8829-content .mode-detail{font-size:.7rem;color:var(–t-ink-soft);margin:6px 0 4px;}
#tmf8829-content .mode-dist{font-size:.82rem;font-weight:700;color:var(–t-ink);}
#tmf8829-content .mode-use{font-size:.64rem;color:var(–t-ink-faint);margin-top:4px;line-height:1.4;}
/* ── Deep Compare Table ────────────────────── */
#tmf8829-content .deep-section{margin-top:64px;}
#tmf8829-content .deep-header{display:flex;align-items:center;gap:14px;margin-bottom:28px;flex-wrap:wrap;}
#tmf8829-content .deep-icon{font-size:2.4rem;}
#tmf8829-content .deep-info h3{font-size:clamp(1.3rem,3vw,1.7rem);font-weight:900;color:var(–t-ink);letter-spacing:-.02em;line-height:1.2;}
#tmf8829-content .deep-info h3 em{font-style:normal;}
#tmf8829-content .deep-info p{font-size:.92rem;color:var(–t-ink-soft);line-height:1.8;margin-top:6px;max-width:580px;}
#tmf8829-content .deep-compare-table{width:100%;border-collapse:separate;border-spacing:0;background:white;border:1px solid var(–t-border);border-radius:var(–t-r);overflow:hidden;margin-top:28px;}
#tmf8829-content .dct-head{background:var(–t-blue-deep);color:white;}
#tmf8829-content .dct-head th{padding:13px 12px;font-size:.72rem;font-weight:700;letter-spacing:.03em;text-align:left;border-bottom:2px solid rgba(255,255,255,.08);}
#tmf8829-content .dct-head th:first-child{width:22%;}
#tmf8829-content .dct-head th:not(:first-child){text-align:center;font-size:.68rem;}
@media(max-width:768px){
#tmf8829-content .dct-head th{padding:10px 6px;font-size:.6rem;}
#tmf8829-content .dct-body td{padding:10px 6px!important;font-size:.76rem!important;}
}
#tmf8829-content .dct-body tr{border-bottom:1px solid var(–t-border);}
#tmf8829-content .dct-body tr:last-child{border-bottom:none;}
#tmf8829-content .dct-body tr:nth-child(even){background:#fafcfe;}
#tmf8829-content .dct-body td{padding:12px 14px;font-size:.82rem;color:var(–t-ink-soft);vertical-align:middle;}
#tmf8829-content .dct-body td:first-child{font-weight:650;color:var(–t-ink);font-size:.84rem;background:#f8fafc;}
#tmf8829-content .dct-body td:not(:first-child){text-align:center;}
#tmf8829-content .dct-winner{color:var(–t-teal);font-weight:750;background:rgba(13,148,136,.06)!important;}
#tmf8829-content .dct-good{color:var(–t-green);font-weight:650;}
#tmf8829-content .dct-mid{color:var(–t-amber);font-weight:550;}
#tmf8829-content .dct-bad{color:var(–t-red);font-weight:550;}
#tmf8829-content .dct-tag{display:inline-block;font-size:.58rem;font-weight:700;padding:2px 6px;border-radius:100px;letter-spacing:.02em;margin-left:3px;}
#tmf8829-content .tag-win{background:var(–t-teal-light);color:var(–t-teal);}
#tmf8829-content .tag-ok{background:var(–t-green-light);color:var(–t-green);}
#tmf8829-content .tag-warn{background:var(–t-amber-light);color:var(–t-amber);}
#tmf8829-content .tag-bad{background:var(–t-red-light);color:var(–t-red);}
/* ── Feature Cards after table ─────────────── */
#tmf8829-content .deep-features{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-top:32px;}
@media(max-width:768px){#tmf8829-content .deep-features{grid-template-columns:1fr;}}
#tmf8829-content .df-card{background:white;border:1px solid var(–t-border);border-radius:var(–t-r-sm);padding:22px 20px;position:relative;overflow:hidden;}
#tmf8829-content .df-icon{width:34px;height:34px;border-radius:8px;display:flex;align-items:center;justify-content:center;font-size:1rem;margin-bottom:10px;}
#tmf8829-content .df-icon.b{background:var(–t-blue-light);} #tmf8829-content .df-icon.t{background:var(–t-teal-light);} #tmf8829-content .df-icon.a{background:var(–t-amber-light);} #tmf8829-content .df-icon.g{background:var(–t-green-light);} #tmf8829-content .df-icon.p{background:var(–t-purple-light);}
#tmf8829-content .df-title{font-size:.88rem;font-weight:750;color:var(–t-ink);margin-bottom:6px;}
#tmf8829-content .df-body{font-size:.82rem;color:var(–t-ink-soft);line-height:1.76;}
#tmf8829-content .df-body strong{color:var(–t-ink);font-weight:650;}
#tmf8829-content .df-vs{font-size:.72rem;color:var(–t-teal);font-weight:600;margin-top:6px;display:block;}
/* Door accent override */
#tmf8829-content .door-accent .deep-info h3 em{color:#ec4899;}
#tmf8829-content .door-accent .dct-head{background:linear-gradient(135deg,#1a1a2e,#4c1d95);}
#tmf8829-content .door-accent .df-card::before{content:”;position:absolute;top:0;left:0;right:0;height:3px;background:linear-gradient(90deg,#ec4899,#f472b6);border-radius:8px 8px 0 0;}
/* Door workflow */
#tmf8829-content .door-workflow-viz{background:linear-gradient(180deg,#1a1a2e,#16213e);padding:36px 28px;border-radius:0 0 var(–t-r) var(–t-r);}
#tmf8829-content .wf-steps{display:flex;gap:10px;justify-content:center;flex-wrap:wrap;}
#tmf8829-content .wf-step{background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.08);border-radius:var(–t-r-sm);padding:18px 16px;text-align:center;width:132px;position:relative;}
#tmf8829-content .wf-step::after{content:’→’;position:absolute;right:-14px;top:50%;transform:translateY(-50%);color:rgba(255,255,255,.25);font-size:1rem;font-weight:300;}
#tmf8829-content .wf-step:last-child::after{display:none;}
#tmf8829-content .wf-num{width:26px;height:26px;border-radius:50%;background:linear-gradient(135deg,#ec4899,#f472b6);color:white;font-size:.74rem;font-weight:700;display:flex;align-items:center;justify-content:center;margin:0 auto 8px;}
#tmf8829-content .wf-t{font-size:.76rem;font-weight:700;color:white;margin-bottom:3px;}
#tmf8829-content .wf-d{font-size:.66rem;color:rgba(255,255,255,.42);line-height:1.5;}
/* Safety highlight */
#tmf8829-content .safety-highlight{background:linear-gradient(135deg,#fef2f2,#fff1f2);border:1.5px solid #fecaca;border-left:4px solid var(–t-red);border-radius:var(–t-r-sm);padding:22px 26px;margin-top:28px;}
#tmf8829-content .sh-title{font-size:.94rem;font-weight:800;color:var(–t-red);margin-bottom:8px;display:flex;align-items:center;gap:8px;}
#tmf8829-content .sh-body{font-size:.85rem;color:var(–t-ink-soft);line-height:1.82;}
#tmf8829-content .sh-body strong{color:var(–t-red);font-weight:650;}
/* Use case box */
#tmf8829-content .use-case-box{background:linear-gradient(135deg,var(–t-blue-light),var(–t-teal-light));border:1px solid var(–t-border);border-radius:var(–t-r-sm);padding:22px 26px;margin-top:28px;}
#tmf8829-content .uc-title{font-size:.88rem;font-weight:750;color:var(–t-blue-deep);margin-bottom:10px;}
#tmf8829-content .uc-list{font-size:.84rem;color:var(–t-ink-soft);line-height:1.9;}
#tmf8829-content .uc-list strong{color:var(–t-ink);font-weight:650;}
/* Other Apps Grid */
#tmf8829-content .other-apps-section{margin-top:56px;}
#tmf8829-content .other-app-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-top:24px;}
@media(max-width:768px){#tmf8829-content .other-app-grid{grid-template-columns:repeat(2,1fr);}}
@media(max-width:480px){#tmf8829-content .other-app-grid{grid-template-columns:1fr;}}
#tmf8829-content .oa-card{background:white;border:1px solid var(–t-border);border-radius:var(–t-r-sm);padding:22px 20px;transition:transform .2s,box-shadow .2s;}
#tmf8829-content .oa-card:hover{transform:translateY(-2px);box-shadow:0 6px 20px rgba(0,0,0,.06);}
#tmf8829-content .oa-tag{font-size:.64rem;font-weight:700;letter-spacing:.06em;padding:3px 10px;border-radius:100px;display:inline-block;margin-bottom:10px;}
#tmf8829-content .oa-title{font-size:.96rem;font-weight:770;color:var(–t-ink);margin-bottom:6px;}
#tmf8829-content .oa-body{font-size:.82rem;color:var(–t-ink-soft);line-height:1.76;}
/* Spec Section */
#tmf8829-content .spec-section{background:linear-gradient(145deg,#0f172a,#1e293b);border-radius:var(–t-r);overflow:hidden;margin-top:52px;}
#tmf8829-content .spec-header{padding:22px 28px;border-bottom:1px solid rgba(255,255,255,.06);}
#tmf8829-content .spec-header h3{font-size:1.15rem;color:white;font-weight:750;}
#tmf8829-content .spec-grid{display:grid;grid-template-columns:repeat(4,1fr);}
@media(max-width:768px){#tmf8829-content .spec-grid{grid-template-columns:repeat(2,1fr);}}
#tmf8829-content .spec-cell{padding:18px 20px;border-right:1px solid rgba(255,255,255,.05);border-bottom:1px solid rgba(255,255,255,.05);}
#tmf8829-content .spec-cell:nth-child(4n){border-right:none;}
#tmf8829-content .spec-key{font-size:.62rem;color:#94a3b8;letter-spacing:.07em;text-transform:uppercase;margin-bottom:4px;}
#tmf8829-content .spec-val{font-size:1.35rem;font-weight:800;color:white;line-height:1.1;}
#tmf8829-content .spec-unit{font-size:.7rem;color:rgba(255,255,255,.38);margin-top:2px;}
/* Steps */
#tmf8829-content .steps{display:flex;flex-direction:column;}
#tmf8829-content .step{display:grid;grid-template-columns:46px 1fr;gap:22px;align-items:start;padding:22px 0;border-bottom:1px solid var(–t-border);}
#tmf8829-content .step:last-child{border-bottom:none;}
#tmf8829-content .step-num{width:38px;height:38px;border-radius:50%;background:linear-gradient(135deg,var(–t-blue-deep),var(–t-blue));color:white;display:flex;align-items:center;justify-content:center;font-size:1rem;font-weight:800;flex-shrink:0;}
#tmf8829-content .step-title{font-size:.96rem;font-weight:750;color:var(–t-ink);margin-bottom:6px;padding-top:7px;}
#tmf8829-content .step-text{font-size:.86rem;color:var(–t-ink-soft);line-height:1.82;}
#tmf8829-content .step-text code{background:var(–t-blue-light);padding:2px 6px;border-radius:4px;font-size:.82em;color:var(–t-blue-deep);font-family:’SF Mono’,Consolas,monospace;}
/* Highlight Box */
#tmf8829-content .highlight-box{background:linear-gradient(135deg,var(–t-blue-light),var(–t-teal-light));border:1px solid var(–t-border);border-radius:var(–t-r);padding:24px 28px;margin-top:36px;}
#tmf8829-content .hb-title{font-size:.9rem;font-weight:750;color:var(–t-blue-deep);margin-bottom:8px;}
#tmf8829-content .hb-body{font-size:.86rem;color:var(–t-ink-soft);line-height:1.82;}
#tmf8829-content .hb-body strong{font-weight:700;}
/* Divider */
#tmf8829-content .divider{width:100%;height:1px;background:linear-gradient(to right,transparent,var(–t-border),transparent);margin:0 auto;}
