/* Rosbon Company Limited — shared design-system stylesheet
 * Loaded by every page (index, about, keke, parts, tracking, waka).
 * The design scale here (1280px container etc.) is the single source of
 * truth. Do not reorder rules that share a selector — the extraction was
 * verified against a per-page cascade analysis. */

*,*::before,*::after{margin:0;padding:0;box-sizing:border-box;}
html{scroll-behavior:smooth;scroll-padding-top:72px;-webkit-text-size-adjust:100%;}
::-webkit-scrollbar{width:3px;}
::-webkit-scrollbar-track{background:transparent;}
::-webkit-scrollbar-thumb{background:rgba(200,21,27,0.35);border-radius:99px;}
a{text-decoration:none;color:inherit;}
img{max-width:100%;display:block;height:auto;}
button{cursor:pointer;font-family:inherit;border:none;background:none;}
ul,ol{list-style:none;}
.t-overline{font-family:var(--font-ui);font-size:clamp(9.5px,2vw,11px);font-weight:600;letter-spacing:0.20em;text-transform:uppercase;color:var(--text-muted);}
.t-body{font-family:var(--font-body);font-size:clamp(13.5px,3vw,15.5px);font-weight:400;line-height:1.75;color:var(--text-secondary);}
.container{width:100%;max-width:1280px;margin-left:auto;margin-right:auto;padding-left:clamp(18px,5vw,48px);padding-right:clamp(18px,5vw,48px);}
.section{padding-top:clamp(72px,13vw,120px);padding-bottom:clamp(72px,13vw,120px);position:relative;overflow:hidden;}
.glass-card{background:var(--bg-card);backdrop-filter:blur(20px) saturate(140%);-webkit-backdrop-filter:blur(20px) saturate(140%);border:1px solid var(--border-subtle);border-radius:var(--r-xl);transition:background 0.35s var(--ease-out),border-color 0.35s var(--ease-out),transform 0.35s var(--ease-out),box-shadow 0.35s var(--ease-out);}
.glass-card:hover{background:var(--bg-card-h);border-color:var(--border-brand);transform:translateY(-4px);box-shadow:var(--shadow-md),var(--shadow-glow);}
.reveal{opacity:0;transform:translateY(36px);transition:opacity 0.8s var(--ease-out),transform 0.8s var(--ease-out);will-change:transform,opacity;}
.reveal.visible{opacity:1;transform:translateY(0);}
.d1{transition-delay:0.05s;}
.d2{transition-delay:0.10s;}
.d3{transition-delay:0.16s;}
.d4{transition-delay:0.22s;}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:7px;padding:14px 28px;border-radius:var(--r-md);font-family:var(--font-ui);font-size:11.5px;font-weight:700;letter-spacing:0.08em;text-transform:uppercase;cursor:pointer;border:none;white-space:nowrap;transition:all 0.3s var(--ease-out);}
.btn:active{transform:scale(0.96);}
.btn-primary{background:var(--c-crimson);color:#fff;box-shadow:0 6px 28px var(--c-crimson-glow);}
.btn-primary:hover{background:var(--c-crimson-h);box-shadow:0 10px 40px rgba(200,21,27,0.38);transform:translateY(-2px);}
.page-back-link:hover{color:var(--text-primary);border-color:var(--border-med);transform:translateX(-4px);}
.header-nav{display:none;position:fixed;top:0;left:0;right:0;z-index:9999;padding:12px clamp(18px,5vw,48px);background:var(--bg-glass);backdrop-filter:blur(28px) saturate(180%);-webkit-backdrop-filter:blur(28px) saturate(180%);border-bottom:1px solid var(--border-subtle);}
.header-nav.scrolled{box-shadow:var(--shadow-md);}
.header-inner{max-width:1280px;margin:0 auto;display:flex;align-items:center;justify-content:space-between;width:100%;}
.header-logo{display:flex;align-items:center;gap:10px;text-decoration:none;flex-shrink:0;}
.header-logo-img{width:38px;height:38px;border-radius:var(--r-sm);object-fit:contain;}
.header-logo-text{font-family:var(--font-ui);font-size:14px;font-weight:800;letter-spacing:0.12em;text-transform:uppercase;color:var(--text-primary);}
.header-links{display:flex;align-items:center;gap:2px;}
.header-link{font-family:var(--font-ui);font-size:11px;font-weight:600;letter-spacing:0.05em;color:var(--text-muted);padding:8px 14px;border-radius:var(--r-pill);transition:all 0.25s var(--ease-out);text-decoration:none;white-space:nowrap;}
.header-link:hover{color:var(--text-primary);background:var(--bg-input);}
.header-link.active{color:var(--text-brand);background:rgba(200,21,27,0.10);}
.header-actions{display:flex;align-items:center;gap:6px;flex-shrink:0;}
.theme-toggle-btn{width:34px;height:34px;border-radius:50%;background:var(--bg-input);border:1px solid var(--border-subtle);display:flex;align-items:center;justify-content:center;cursor:pointer;color:var(--text-muted);transition:all 0.3s var(--ease-snap);}
.theme-toggle-btn:hover{background:var(--bg-glass-h);border-color:var(--border-med);color:var(--text-primary);transform:scale(1.08);}
[data-theme="dark"] .icon-moon,[data-theme="light"] .icon-sun{display:none;}
.header-cta:hover{background:var(--c-crimson-h);transform:translateY(-2px);box-shadow:0 8px 28px rgba(200,21,27,0.42);}
.mobile-dock{position:fixed;bottom:10px;left:50%;transform:translateX(-50%);width:calc(100% - 16px);max-width:480px;height:58px;z-index:9999;border-radius:var(--r-pill);display:flex;align-items:center;justify-content:space-between;padding:0 3px 0 6px;gap:1px;background:var(--bg-glass);backdrop-filter:blur(32px) saturate(180%);-webkit-backdrop-filter:blur(32px) saturate(180%);border:1px solid var(--border-med);box-shadow:var(--shadow-dock);animation:dock-rise 0.8s var(--ease-out) 0.3s both;}
.dock-brand{display:flex;align-items:center;gap:5px;padding:3px;flex-shrink:0;text-decoration:none;}
.dock-logo-img{width:30px;height:30px;border-radius:50%;object-fit:contain;}
.dock-nav-links{display:flex;align-items:center;flex:1;justify-content:center;gap:0;overflow:hidden;}
.dock-link{display:flex;flex-direction:column;align-items:center;gap:1px;padding:5px 7px;border-radius:var(--r-pill);font-family:var(--font-ui);font-size:8px;font-weight:600;letter-spacing:0.02em;color:var(--text-muted);text-decoration:none;transition:all 0.25s var(--ease-snap);white-space:nowrap;}
.dock-link:hover{color:var(--text-primary);transform:translateY(-4px);background:var(--bg-input);}
.dock-link-label{font-size:7.5px;}
.dock-actions{display:flex;align-items:center;gap:4px;flex-shrink:0;}
.dock-cta:hover{background:var(--c-crimson-h);transform:translateY(-2px);box-shadow:0 8px 28px rgba(200,21,27,0.42);}
.wa-float{position:fixed;right:14px;bottom:calc(58px + 22px);width:48px;height:48px;border-radius:50%;background:#25D366;display:flex;align-items:center;justify-content:center;box-shadow:0 6px 24px rgba(37,211,102,0.40);z-index:9998;transition:transform 0.3s var(--ease-snap);text-decoration:none;animation:dock-rise 0.8s var(--ease-out) 0.8s both;}
.wa-float:hover{transform:scale(1.12);box-shadow:0 10px 32px rgba(37,211,102,0.55);}
.relative{position:relative;}
.z1{z-index:1;}
.mt-0{margin-top:0;}
#footer{background:var(--bg-surface);border-top:1px solid var(--border-subtle);}
.footer-top{display:grid;grid-template-columns:1fr;gap:clamp(36px,6vw,56px);padding:clamp(52px,9vw,88px) 0 clamp(36px,5vw,56px);}
.footer-brand{display:flex;flex-direction:column;gap:18px;}
.footer-logo-row{display:flex;align-items:center;gap:10px;}
.footer-logo-box{width:40px;height:40px;border-radius:var(--r-md);display:flex;align-items:center;justify-content:center;overflow:hidden;flex-shrink:0;}
.footer-logo-box img{width:100%;height:100%;object-fit:contain;}
.footer-brand-name{font-family:var(--font-ui);font-size:14px;font-weight:800;letter-spacing:0.08em;text-transform:uppercase;color:var(--text-primary);}
.footer-brand-sub{font-size:9.5px;color:var(--text-muted);font-weight:500;margin-top:1px;}
.footer-tagline{font-size:12.5px;color:var(--text-muted);line-height:1.70;}
.footer-contact{display:flex;flex-direction:column;gap:8px;}
.footer-contact-item{display:flex;align-items:center;gap:8px;font-size:11.5px;color:var(--text-secondary);text-decoration:none;}
.footer-col-title{font-family:var(--font-ui);font-size:10px;font-weight:700;letter-spacing:0.14em;text-transform:uppercase;color:var(--text-primary);margin-bottom:16px;}
.footer-links{display:flex;flex-direction:column;gap:9px;}
.footer-link{font-size:12px;color:var(--text-muted);transition:color 0.2s,transform 0.2s;display:flex;align-items:center;gap:5px;text-decoration:none;}
.footer-link:hover{color:var(--text-primary);transform:translateX(3px);}
.footer-bottom{border-top:1px solid var(--border-subtle);padding:18px 0;display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:10px;}
.footer-copy{font-size:11px;color:var(--text-muted);}
.footer-copy a{color:var(--text-brand);font-weight:600;}
.footer-legal{display:flex;gap:16px;}
.footer-legal a{font-size:10px;color:var(--text-muted);transition:color 0.2s;text-decoration:none;}
.footer-legal a:hover{color:var(--text-primary);}
.socials{display:flex;gap:8px;flex-wrap:wrap;flex-direction:column;}
.social-pill{display:flex;align-items:center;gap:6px;padding:7px 13px;border-radius:var(--r-pill);background:var(--bg-input);border:1px solid var(--border-subtle);font-family:var(--font-ui);font-size:10.5px;font-weight:600;color:var(--text-muted);text-decoration:none;transition:all 0.28s var(--ease-snap);}
.social-pill:hover{background:var(--bg-card-h);border-color:var(--border-med);color:var(--text-primary);transform:translateY(-2px);}
.skip-link{position:fixed;left:12px;top:12px;z-index:10000;transform:translateY(-200%);background:var(--c-crimson);color:#fff;padding:12px 20px;border-radius:var(--r-md);font-family:var(--font-ui);font-size:11px;font-weight:700;letter-spacing:0.08em;text-transform:uppercase;text-decoration:none;box-shadow:var(--shadow-md);transition:transform 0.2s var(--ease-out);}
.skip-link:focus{transform:translateY(0);}
.sr-only{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0;}
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,[tabindex]:focus-visible{outline:2px solid var(--text-accent);outline-offset:2px;}
.btn:focus-visible,.header-cta:focus-visible,.dock-cta:focus-visible,.header-link:focus-visible,.dock-link:focus-visible,.social-pill:focus-visible,.theme-toggle-btn:focus-visible,.page-back-link:focus-visible{outline:2px solid var(--text-accent);outline-offset:3px;border-radius:var(--r-sm);}