/* about.css */
.section{padding:clamp(26px,3.2vw,44px) 0}
.section.tight{padding:clamp(18px,2.4vw,36px) 0}
.hero-compact{display:flex;align-items:center;justify-content:space-between;gap:14px}
.hero-right{display:flex;align-items:center;gap:12px}
.badge3d-wrap{width:var(--badge-size,96px);height:var(--badge-size,96px);min-width:84px;min-height:84px;position:relative}
.badge3d .badge3d-core{position:absolute;inset:0}
.badge3d .badge3d-img{position:absolute;inset:10% 10% 10% 10%;width:80%;height:80%;object-fit:contain}

.about-intro{display:grid;grid-template-columns:1.1fr .9fr;gap:14px;align-items:start;border:1px solid var(--edge);border-radius:var(--radius);padding:16px;background:linear-gradient(180deg,rgba(255,255,255,.03),rgba(255,255,255,.01));box-shadow:var(--shadow)}
.intro-copy p{margin:.2rem 0 .6rem}
.intro-aside{background:var(--panel-strong);border:1px solid var(--edge);border-radius:var(--radius);padding:14px}
.quote{font-family:"Cinzel",serif;font-weight:900;letter-spacing:.04em;color:#ffd3c6}
.ticks{list-style:none;margin:10px 0 0;padding:0;display:flex;gap:8px;flex-wrap:wrap}
.ticks li{padding:6px 10px;border:1px solid var(--edge);border-radius:999px;background:rgba(255,255,255,.02);font-size:.9rem;color:#cfd6dd}
@media(max-width:980px){.about-intro{grid-template-columns:1fr}}

.h2.compact{margin:.1rem 0 .6rem}

.timeline{position:relative}
.tlist{list-style:none;margin:0;padding:0;display:grid;gap:10px;counter-reset:ms}
.tlist>li{display:grid;grid-template-columns:160px 1fr;gap:12px;position:relative}
.tdate{color:#9aa3ad}
.tcard{background:linear-gradient(180deg,rgba(255,255,255,.03),rgba(255,255,255,.01));border:1px solid var(--edge);border-radius:14px;padding:12px;position:relative}
.tlist>li::before{content:"";position:absolute;left:145px;top:0;bottom:-10px;width:2px;background:rgba(255,255,255,.08)}
.tlist>li:last-child::before{bottom:0}
@media(max-width:780px){.tlist>li{grid-template-columns:1fr}.tlist>li::before{display:none}.tdate{margin-bottom:6px}}

.brand-compare .logos{display:grid;grid-template-columns:repeat(12,1fr);gap:14px;margin-top:6px}
.logo-card{grid-column:span 6;background:var(--panel-strong);border:1px solid var(--edge);border-radius:16px;padding:12px;text-align:center;position:relative;overflow:hidden}
.logo-card .frame{position:relative;aspect-ratio:1;border:1px solid var(--edge);border-radius:12px;background:#05070b}
.logo-card img{position:absolute;inset:8% 8% 8% 8%;width:84%;height:84%;object-fit:contain;filter:drop-shadow(0 10px 30px rgba(0,0,0,.5))}
.logo-card figcaption{margin-top:8px;color:#cfd6dd;font-weight:800;letter-spacing:.03em}
.logo-card .gloss{position:absolute;inset:-2px;background:linear-gradient(110deg,transparent 0%,rgba(255,255,255,.25) 18%,transparent 36%);transform:translateX(-120%);animation:shine 9s linear infinite}
.logo-card.tilt:hover{transform:rotateX(2deg) rotateY(-2deg)}
.logo-card.tilt{transition:transform .2s ease}
@media(max-width:980px){.logo-card{grid-column:span 12}}
@keyframes shine{0%{transform:translateX(-120%)}10%{transform:translateX(120%)}100%{transform:translateX(120%)}}
.brand-note{margin:.6rem 0 0;color:var(--muted)}

.today p{margin:.2rem 0}

.cta-ribbon{display:flex;align-items:center;justify-content:space-between;gap:14px;background:linear-gradient(180deg,rgba(255,255,255,.03),rgba(255,255,255,.01));border:1px solid var(--edge);border-radius:var(--radius);padding:16px;box-shadow:var(--shadow)}
@media(max-width:720px){.cta-ribbon{flex-direction:column;align-items:flex-start}}
.cta-line{font-weight:900;letter-spacing:.03em}
.cta-sub{color:var(--muted);margin-top:2px}
.text-cta{color:#ffd3c6;text-decoration:none;border-bottom:1px dotted rgba(255,138,92,.45);padding-bottom:2px;display:inline-flex;align-items:center;gap:8px;font-weight:900;letter-spacing:.03em}
.text-cta span{opacity:.8;transform:translateX(0);transition:transform .18s ease,opacity .18s ease}
.text-cta:hover{color:#fff;border-bottom-color:rgba(255,179,157,.8)}
.text-cta:hover span{transform:translateX(2px);opacity:1}
.text-cta.big{font-size:1.05rem}
