:root { --ink:#171614; --muted:#746f68; --line:#ded9d1; --paper:#faf9f6; --cream:#f4eee5; --accent:#ed4b2f; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; color:var(--ink); background:var(--paper); font-family:-apple-system,BlinkMacSystemFont,"Hiragino Kaku Gothic ProN","Yu Gothic",Meiryo,sans-serif; line-height:1.8; }
a { color:inherit; }
.wrap { width:min(100% - 40px, 960px); margin-inline:auto; }
.site-header { padding-top:28px; }
.brand { font-size:1.25rem; font-weight:700; letter-spacing:.08em; text-decoration:none; }
.portal-hero { padding:clamp(88px,16vw,170px) 0 140px; }
.eyebrow { margin:0 0 22px; color:var(--muted); font-size:.72rem; font-weight:700; letter-spacing:.2em; }
h1,h2,h3,p { margin-top:0; }
h1 { margin-bottom:30px; font-size:clamp(2.8rem,8vw,5.8rem); font-weight:700; line-height:1.15; letter-spacing:-.06em; }
h2 { margin-bottom:8px; font-size:clamp(2.4rem,7vw,4.5rem); line-height:1.2; letter-spacing:-.05em; }
.lead { color:var(--muted); font-size:1.05rem; }
.products { padding:0 0 150px; border-top:1px solid var(--line); }
.products .eyebrow { padding-top:34px; }
.tagline { font-size:1.25rem; font-weight:700; }
.products > p:not(.eyebrow):not(.tagline) { color:var(--muted); }
.button { display:inline-flex; gap:18px; align-items:center; margin-top:28px; padding:13px 20px; border:1px solid var(--ink); border-radius:999px; font-weight:700; text-decoration:none; transition:.2s ease; }
.button:hover,.button:focus-visible { color:#fff; background:var(--ink); }
.site-footer { padding:26px 0 34px; border-top:1px solid var(--line); color:var(--muted); }
.tap5-page { background:var(--cream); }
.tap5-page .site-header { display:flex; justify-content:space-between; align-items:center; }
.wordmark { font-size:1.35rem; font-weight:800; letter-spacing:-.06em; text-decoration:none; }
.wordmark span { color:var(--accent); }
.header-link { color:var(--muted); font-size:.85rem; text-decoration:none; }
.tap5-hero { padding:clamp(90px,15vw,150px) 0 110px; }
.tap5-hero h1 { margin-bottom:20px; font-size:clamp(4rem,15vw,9rem); letter-spacing:-.11em; }
.tap5-hero h1 span { color:var(--accent); }
.tap5-hero .tagline { max-width:18em; font-size:clamp(1.35rem,3vw,2rem); }
.tap5-section { padding:80px 0; border-top:1px solid rgba(23,22,20,.15); }
.tap5-section h2 { margin-bottom:28px; font-size:clamp(1.8rem,4vw,2.6rem); letter-spacing:-.06em; }
.tap5-section p { max-width:42em; }
.steps,.feature-list { display:grid; gap:18px; margin:0; padding:0; list-style:none; }
.steps li,.feature-list li { display:grid; grid-template-columns:2.5rem 1fr; gap:12px; align-items:start; padding:18px 0; border-bottom:1px solid rgba(23,22,20,.12); }
.steps strong { color:var(--accent); font-size:.9rem; }
.feature-list li { display:block; }
.feature-list strong { display:block; margin-bottom:3px; }
.support-note { color:var(--muted); }
.policy-page { background:var(--paper); }
.policy-hero { padding:90px 0 60px; }
.policy-hero h1 { font-size:clamp(2.3rem,6vw,4.5rem); }
.policy-meta { color:var(--muted); font-size:.9rem; }
.policy-section { padding:38px 0; border-top:1px solid var(--line); }
.policy-section h2 { margin-bottom:14px; font-size:1.35rem; letter-spacing:-.03em; }
.policy-section p { max-width:48em; }
@media (min-width:700px) { .wrap { width:min(100% - 80px,960px); } .steps { grid-template-columns:repeat(2,1fr); gap:0 48px; } .feature-list { grid-template-columns:repeat(2,1fr); gap:0 48px; } }