@layer reset, base, components, responsive;

@layer reset {
  *, *::before, *::after { box-sizing: border-box; }
  body, h1, h2, h3, p { margin: 0; }
  img { display: block; max-width: 100%; }
  button, input, textarea { font: inherit; }
  button, a { -webkit-tap-highlight-color: transparent; }
  [hidden] { display: none !important; }
}

@layer base {
  :root { --ink:#173729; --secondary:#52645b; --green:#075c34; --forest:#064c2b; --lime:#d0ef83; --border:#d9e2d9; --paper:#fcfcf8; --wash:#f0f3eb; --radius:22px; font-family:ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif; color:var(--ink); background:var(--paper); font-synthesis:none; text-rendering:optimizeLegibility; }
  html { scroll-behavior:smooth; scroll-padding-top:115px; }
  body { min-width:280px; line-height:1.6; padding-bottom:env(safe-area-inset-bottom); }
  a { color:var(--green); text-decoration-thickness:1px; text-underline-offset:4px; }
  a:hover { text-decoration-thickness:2px; }
  a, button { touch-action:manipulation; }
  a:focus-visible, button:focus-visible, input:focus-visible, textarea:focus-visible { outline:3px solid #14834b; outline-offset:5px; }
  h1, h2, h3 { line-height:1.12; letter-spacing:-.045em; }
  h1 { font-size:clamp(42px,5.5vw,78px); font-weight:680; }
  h2 { font-size:clamp(29px,3.9vw,46px); font-weight:650; }
  h3 { font-size:26px; font-weight:650; }
  p { color:var(--secondary); }
  svg { flex-shrink:0; }
  .shell { width:min(1160px,calc(100% - 72px)); margin-inline:auto; }
  .eyebrow { display:block; font-size:11px; line-height:1.5; font-weight:750; letter-spacing:.16em; }
  .section { padding:88px 0; }
  .compact-top { padding-top:40px; }
  .button { display:inline-flex; align-items:center; justify-content:center; gap:12px; min-height:50px; border:1px solid transparent; border-radius:12px; padding:12px 22px; font-weight:650; font-size:14px; line-height:1.4; text-decoration:none; cursor:pointer; transition:background .16s ease,transform .16s ease; }
  .button:hover { transform:translateY(-1px); }
  .button:disabled { cursor:not-allowed; background:#e8eddf; color:#475c48; border-color:#c4d1bd; transform:none; }
  .button-primary { background:var(--forest); color:white; }
  .button-primary:hover { background:#087244; }
  .button-secondary { background:white; border-color:var(--border); color:var(--green); }
  .text-link { display:inline-flex; align-items:center; gap:10px; min-height:48px; font-size:14px; font-weight:650; text-decoration:none; }
  .small-print { font-size:12px; line-height:1.6; }
  .skip-link { position:absolute; left:16px; top:12px; padding:12px; background:white; border:2px solid var(--green); z-index:5; transform:translateY(-150%); }
  .skip-link:focus { transform:none; }
  .notice { padding:22px; border:1px solid #c7d9be; border-radius:14px; background:#f2f6e9; color:var(--ink); }
  .notice strong { display:block; margin-bottom:7px; font-size:15px; }
  .notice p { font-size:14px; line-height:1.65; }
}

@layer components {
  .site-header { background:#fff; border-bottom:1px solid #e8ebe3; position:relative; z-index:2; padding-top:env(safe-area-inset-top); }
  .header-inner { min-height:94px; display:flex; align-items:center; justify-content:space-between; gap:28px; }
  .brand { display:block; width:188px; flex-shrink:0; }
  .brand img { width:100%; height:auto; }
  .site-header nav { display:flex; gap:30px; align-items:center; }
  .site-header nav a { display:inline-flex; gap:7px; align-items:center; text-decoration:none; font-size:13px; font-weight:650; min-height:48px; }
  .site-header nav a[aria-current] { text-decoration:underline; }
  .hero { padding:72px 0 66px; position:relative; overflow:hidden; }
  .hero-grid { display:grid; grid-template-columns:1.05fr 1fr; gap:56px; align-items:center; }
  .hero-copy .eyebrow { display:flex; align-items:center; gap:8px; }
  .status-dot { width:6px; height:6px; border-radius:50%; background:var(--green); }
  .hero h1 { margin-top:22px; }
  .hero h1 em { font-style:normal; color:var(--green); }
  .lead { max-width:430px; margin-top:25px; font-size:18px; line-height:1.6; }
  .hero-actions { display:flex; gap:25px; align-items:center; margin-top:30px; flex-wrap:wrap; }
  .hero-footnote { display:flex; gap:10px; align-items:center; color:#627266; font-size:11px; margin-top:34px; }
  .mini-line { height:1px; width:24px; background:#aabca8; flex-shrink:0; }
  .journey-visual { height:430px; position:relative; background:#ecf1e7; border-radius:120px 24px 24px 24px; overflow:hidden; border:1px solid #e0e7db; }
  .map-grid { position:absolute; inset:0; background-image:linear-gradient(90deg,transparent 95%,#fff 95%),linear-gradient(0deg,transparent 94%,#fff 94%); background-size:73px 70px; transform:rotate(-7deg) scale(1.1); opacity:.85; }
  .map-block { position:absolute; border-radius:14px; background:#e0e8d4; }
  .block-one { left:12%; top:18%; width:24%; height:20%; background:#d9e5c8; }
  .block-two { left:44%; top:60%; width:19%; height:25%; }
  .block-three { left:65%; top:31%; width:27%; height:25%; background:#d4e1c7; }
  .block-four { left:5%; top:70%; width:30%; height:25%; }
  .map-route { position:absolute; inset:0; width:100%; height:100%; overflow:visible; }
  .route-shadow { stroke:white; stroke-width:15; fill:none; stroke-linejoin:round; }
  .route-main { stroke:#067d42; stroke-width:6; fill:none; stroke-linecap:round; }
  .destination-tag { display:flex; align-items:center; gap:8px; position:absolute; right:32px; top:51px; background:var(--forest); color:#fff; font-size:11px; font-weight:600; border-radius:10px; padding:10px 13px; }
  .journey-note { display:flex; align-items:center; gap:14px; position:absolute; left:26px; right:26px; bottom:55px; padding:18px 20px; background:#fff; border:1px solid #e5ebdf; box-shadow:0 8px 25px #2346300d; border-radius:16px; }
  .note-icon { display:grid; place-items:center; width:47px; height:47px; background:#f0f6e4; border-radius:13px; color:var(--green); flex-shrink:0; }
  .journey-note span { display:block; color:var(--secondary); font-size:12px; }
  .journey-note strong { display:block; font-size:17px; line-height:1.5; }
  .visual-caption { position:absolute; bottom:24px; left:26px; font-size:10px; color:#546d58; letter-spacing:.02em; }
  .intro-strip { padding:32px 0; background:var(--forest); color:white; }
  .intro-grid { display:grid; grid-template-columns:1fr 2fr; align-items:center; gap:40px; }
  .intro-grid .eyebrow { color:#d7ecb3; }
  .intro-grid p { color:#fff; font-size:21px; font-weight:500; line-height:1.4; letter-spacing:-.025em; }
  .section-heading .eyebrow { color:var(--green); margin-bottom:19px; }
  .section-heading h2 span { color:#738278; }
  .apps-grid { display:grid; grid-template-columns:1fr 1fr; gap:22px; margin-top:36px; }
  .app-card, .document-card { position:relative; padding:36px; border:1px solid var(--border); border-radius:var(--radius); background:#fff; }
  .app-card:first-child { background:#f4f7ee; }
  .app-icon { display:grid; place-items:center; width:53px; height:53px; border-radius:15px; color:var(--green); background:#e9f1de; margin-bottom:24px; }
  .app-icon.driver { color:white; background:var(--forest); }
  .app-card .eyebrow { color:#60755c; font-size:10px; margin-bottom:9px; }
  .app-card h3 { font-size:30px; }
  .app-card > p { font-size:14px; margin-top:17px; max-width:360px; }
  .check-list { list-style:none; padding:0; margin:26px 0 0; }
  .check-list li { display:flex; gap:10px; align-items:flex-start; color:var(--ink); margin:13px 0; font-size:13px; }
  .check-list svg { color:var(--green); margin-top:2px; }
  .app-card .release-note { margin-top:31px; padding-top:19px; border-top:1px solid var(--border); font-size:11px; line-height:1.6; color:#596d59; }
  .trust-section { padding:72px 0; background:#f0f3ea; border-block:1px solid #e3e8dd; }
  .trust-grid { display:grid; grid-template-columns:1fr 1fr; gap:70px; align-items:center; }
  .trust-grid .eyebrow { color:var(--green); margin-bottom:18px; font-size:10px; }
  .trust-grid p { font-size:14px; max-width:380px; margin:22px 0 12px; }
  .trust-links a { display:flex; gap:15px; align-items:center; padding:24px 0; border-bottom:1px solid #d4ddcd; text-decoration:none; }
  .trust-links a:first-child { border-top:1px solid #d4ddcd; }
  .link-icon { width:44px; height:44px; border-radius:50%; display:grid; place-items:center; background:#e0e9d7; color:var(--green); flex-shrink:0; }
  .trust-links strong { display:block; font-size:16px; font-weight:650; }
  .trust-links small { display:block; color:#566b58; font-size:11px; margin-top:3px; }
  .trust-links a > svg:last-child { margin-left:auto; }
  .site-footer { background:white; padding-top:56px; }
  .footer-grid { display:grid; grid-template-columns:1fr .9fr 1.15fr; gap:60px; padding-bottom:46px; }
  .footer-brand { width:156px; margin-bottom:18px; }
  .footer-grid p { font-size:12px; line-height:1.7; }
  .footer-links, .footer-company { font-size:12px; }
  .footer-links > span, .footer-company > span { display:block; font-size:11px; font-weight:700; color:#364f3f; margin-bottom:15px; }
  .footer-links a { display:block; width:fit-content; padding:6px 0; color:#566b58; text-decoration:none; }
  .footer-links a:hover { text-decoration:underline; }
  .footer-company p { margin-bottom:14px; }
  .footer-bottom { display:flex; justify-content:space-between; gap:15px; border-top:1px solid #e1e7db; color:#6b7c6e; font-size:10px; padding:21px 0; }
  .page-heading { padding:44px 0 40px; background:var(--wash); border-bottom:1px solid #e3e8dd; }
  .breadcrumb { display:flex; align-items:center; gap:8px; width:fit-content; font-size:11px; text-decoration:none; margin-bottom:30px; }
  .page-heading .eyebrow { color:var(--green); margin-bottom:19px; }
  .page-heading h1 { font-size:clamp(36px,5vw,62px); max-width:800px; }
  .page-heading p { max-width:715px; margin-top:20px; font-size:16px; }
  .document-meta { display:flex; flex-wrap:wrap; gap:16px; color:#536d52; margin-top:25px; font-size:11px; }
  .document-meta span + span::before { content:"·"; margin-right:16px; }
  .legal-layout { display:grid; grid-template-columns:235px minmax(0,1fr); gap:64px; padding-top:52px; padding-bottom:80px; align-items:start; }
  .contents { position:sticky; top:28px; font-size:12px; padding-bottom:20px; }
  .contents h2 { font-size:14px; letter-spacing:0; margin-bottom:18px; }
  .contents nav { display:flex; flex-direction:column; }
  .contents nav a { text-decoration:none; color:#56705b; padding:9px 0; line-height:1.5; }
  .contents nav a:hover { color:var(--green); text-decoration:underline; }
  .contents-help { display:flex; align-items:center; gap:7px; border-top:1px solid var(--border); margin-top:17px; padding-top:19px; text-decoration:none; font-weight:600; }
  .legal-section { padding-bottom:33px; margin-bottom:32px; border-bottom:1px solid #e0e6db; scroll-margin-top:28px; }
  .legal-section h2 { font-size:24px; letter-spacing:-.025em; margin-bottom:17px; }
  .legal-section p, .legal-section li { font-size:14px; line-height:1.85; color:#475f4e; overflow-wrap:anywhere; }
  .legal-section p + p { margin-top:17px; }
  .legal-section ul { padding-left:21px; margin:15px 0 0; }
  .legal-section li + li { margin-top:12px; }
  .legal-end p { margin-bottom:16px; }
  .document-card { display:block; color:var(--ink); text-decoration:none; }
  .document-card:hover { border-color:#759766; box-shadow:0 5px 16px #23463006; }
  .document-card h2 { font-size:30px; margin-bottom:15px; }
  .document-card p { font-size:14px; max-width:340px; margin-bottom:18px; }
  .reading-note { margin-top:30px; color:#627262; font-size:12px; }
  .support-grid { display:grid; grid-template-columns:1fr 1fr; gap:60px; align-items:start; }
  .contact-card { background:#fff; border:1px solid var(--border); border-radius:var(--radius); padding:36px; }
  .contact-card h2 { font-size:30px; }
  .email-link { display:block; overflow-wrap:anywhere; font-size:18px; font-weight:650; text-decoration:none; margin:18px 0; }
  .contact-card > p { font-size:14px; }
  .contact-card .button { margin:25px 0 18px; }
  .contact-card .small-print { font-size:12px; }
  .support-guidance { padding-top:17px; }
  .support-guidance h2 { font-size:25px; }
  .support-guidance .check-list li { font-size:14px; margin-bottom:18px; }
  .support-guidance .notice { margin:30px 0 17px; }
  .operator-box { border-top:1px solid var(--border); margin-top:54px; padding-top:33px; }
  .operator-box h2 { font-size:19px; margin-bottom:17px; letter-spacing:-.01em; }
  .operator-box p { font-size:13px; margin-bottom:13px; max-width:650px; }
  .deletion-layout { display:grid; grid-template-columns:1.15fr 1fr; gap:60px; align-items:start; }
  .deletion-info h2, .request-card h2 { font-size:27px; }
  .deletion-info > p { margin-top:25px; font-size:14px; line-height:1.8; }
  .steps { padding:0; margin:27px 0 30px; list-style:none; }
  .steps li { display:flex; align-items:flex-start; gap:17px; margin-bottom:25px; }
  .steps li > span { display:grid; place-items:center; width:35px; height:35px; flex-shrink:0; background:#e7efdc; border-radius:50%; color:var(--green); font-size:11px; font-weight:700; }
  .steps li strong { display:block; padding-top:3px; font-size:15px; }
  .steps li p { margin-top:8px; font-size:13px; line-height:1.8; }
  .request-card { border:1px solid var(--border); border-radius:var(--radius); background:#fff; padding:30px; }
  .request-card > p { margin-top:15px; font-size:13px; line-height:1.8; }
  .request-card form { margin-top:24px; }
  .request-card label:not(.checkbox-label) { display:block; font-size:12px; font-weight:650; margin-bottom:7px; }
  .optional { font-size:10px; font-weight:400; color:#5d715e; margin-left:4px; }
  .request-card input:not([type=checkbox]), .request-card textarea { display:block; width:100%; padding:12px 13px; border:1px solid #bacbb8; background:#fcfdf9; border-radius:9px; color:var(--ink); font-size:14px; min-height:48px; margin-bottom:18px; resize:vertical; }
  .request-card input::placeholder, .request-card textarea::placeholder { color:#647968; opacity:1; }
  .request-card textarea { min-height:108px; margin-bottom:6px; }
  .field-note { color:#526c54; font-size:11px; line-height:1.6; }
  .checkbox-label { display:flex; align-items:flex-start; gap:10px; margin:24px 0; font-size:12px; line-height:1.7; color:#465f4c; cursor:pointer; }
  .checkbox-label input { margin:4px 0 0; width:17px; height:17px; accent-color:var(--green); flex-shrink:0; }
  .request-card .button { width:100%; }
  .request-card hr { border:0; border-top:1px solid var(--border); margin:26px 0 0; }
  .request-result { margin-top:27px; padding-top:27px; border-top:1px solid var(--border); }
  .request-result h3 { font-size:21px; margin-bottom:15px; }
  .request-result p { font-size:13px; line-height:1.7; }
  .request-result pre { white-space:pre-wrap; overflow-wrap:anywhere; font:12px/1.8 ui-sans-serif,system-ui,sans-serif; padding:16px; margin:19px 0; background:#f1f5eb; border-radius:10px; max-height:290px; overflow-y:auto; }
  .result-actions { display:flex; flex-direction:column; gap:10px; }
  #copy-status { min-height:22px; margin-top:12px; color:var(--green); font-size:12px; }
  .not-found { padding:95px 0; }
  .not-found .button { margin-top:30px; }
}

@layer responsive {
  @media(max-width:1000px) {
    .hero-grid { gap:35px; }
    .hero h1 { font-size:60px; }
    .journey-visual { height:385px; }
    .hero .eyebrow { font-size:9px; }
    .trust-grid, .footer-grid { gap:35px; }
    .legal-layout { gap:35px; grid-template-columns:200px minmax(0,1fr); }
    .deletion-layout, .support-grid { gap:30px; }
  }
  @media(max-width:760px) {
    .shell { width:calc(100% - 40px); }
    .header-inner { min-height:84px; gap:15px; }
    .brand { width:157px; }
    .site-header nav { gap:15px; }
    .site-header nav a { font-size:11px; }
    .site-header nav .nav-apps { display:none; }
    .site-header nav a svg { display:none; }
    .hero { padding:45px 0; }
    .hero-grid { grid-template-columns:1fr; gap:35px; }
    .hero h1 { font-size:65px; }
    .hero .eyebrow { font-size:10px; }
    .lead { font-size:17px; max-width:500px; }
    .hero-footnote { margin-top:25px; }
    .journey-visual { width:100%; height:340px; border-top-left-radius:85px; }
    .map-grid { transform:rotate(-7deg) scale(1.3); }
    .journey-note { bottom:42px; padding:15px; }
    .visual-caption { bottom:18px; }
    .destination-tag { top:35px; }
    .intro-grid { grid-template-columns:1fr; gap:10px; }
    .intro-grid p { font-size:19px; max-width:500px; }
    .intro-strip { padding:25px 0; }
    .section { padding:52px 0; }
    .compact-top { padding-top:30px; }
    .apps-grid { gap:17px; }
    .app-card, .document-card { padding:25px; }
    .app-card h3 { font-size:25px; }
    .check-list li { font-size:12px; }
    .trust-grid { grid-template-columns:1fr; gap:25px; }
    .trust-section { padding:45px 0; }
    .trust-links a { padding:20px 0; }
    .footer-grid { grid-template-columns:1fr 1fr; gap:28px; padding-bottom:30px; }
    .footer-company { grid-column:1/-1; border-top:1px solid var(--border); padding-top:23px; }
    .site-footer { padding-top:37px; }
    .footer-bottom { font-size:9px; align-items:flex-start; }
    .footer-bottom span:last-child { max-width:170px; text-align:right; }
    .page-heading { padding:28px 0 30px; }
    .breadcrumb { margin-bottom:24px; }
    .page-heading h1 { font-size:44px; }
    .page-heading p { font-size:14px; }
    .legal-layout { grid-template-columns:1fr; gap:27px; padding-top:30px; padding-bottom:48px; }
    .contents { position:static; border-bottom:1px solid var(--border); padding-bottom:22px; }
    .contents nav { display:grid; grid-template-columns:1fr 1fr; column-gap:20px; }
    .contents nav a { font-size:11px; padding:6px 0; }
    .contents h2 { margin-bottom:12px; }
    .contents-help { border:none; margin-top:10px; padding-top:4px; }
    .legal-section h2 { font-size:23px; }
    .support-grid, .deletion-layout { grid-template-columns:1fr; gap:30px; }
    .support-guidance { padding-top:0; }
    .contact-card { padding:27px; }
    .deletion-info .notice { padding:20px; }
    .request-card { padding:25px; }
  }
  @media(max-width:500px) {
    .shell { width:calc(100% - 36px); }
    .header-inner { min-height:80px; gap:12px; flex-wrap:wrap; padding:16px 0 10px; }
    .brand { width:144px; }
    .site-header nav { gap:14px; }
    .site-header nav a { font-size:11px; min-height:40px; }
    .site-header nav a:first-child:not(.nav-apps) { display:none; }
    .hero h1 { font-size:57px; }
    .hero-actions { gap:22px; margin-top:24px; }
    .hero .eyebrow { font-size:8px; letter-spacing:.11em; }
    .hero .lead { font-size:15px; }
    .hero .button { padding-inline:17px; font-size:13px; }
    .hero-actions .text-link { font-size:12px; }
    .journey-visual { height:308px; border-top-left-radius:74px; }
    .journey-note { left:17px; right:17px; gap:10px; padding:14px; }
    .journey-note strong { font-size:14px; }
    .journey-note span { font-size:10px; }
    .note-icon { width:39px; height:39px; border-radius:10px; }
    .destination-tag { right:20px; font-size:10px; }
    .visual-caption { left:20px; font-size:9px; }
    .apps-grid { grid-template-columns:1fr; margin-top:28px; }
    .section-heading h2 { font-size:34px; }
    .app-card, .document-card { padding:28px; }
    .app-card .check-list li { font-size:13px; }
    .app-card h3 { font-size:29px; }
    .footer-grid { grid-template-columns:1fr; gap:26px; }
    .footer-company { grid-column:auto; }
    .footer-grid > div:first-child { display:flex; justify-content:space-between; gap:25px; align-items:center; }
    .footer-brand { width:135px; margin-bottom:0; }
    .footer-grid > div:first-child p { font-size:10px; }
    .page-heading h1 { font-size:38px; }
    .page-heading .eyebrow { font-size:9px; }
    .document-meta { font-size:10px; gap:10px; }
    .document-meta span + span::before { margin-right:10px; }
    .request-card, .contact-card { padding:22px; }
    .legal-section { padding-bottom:26px; margin-bottom:26px; }
    .legal-section p, .legal-section li { font-size:14px; }
    .contents nav { column-gap:16px; }
    .email-link { font-size:17px; }
  }
  @media(prefers-reduced-motion:reduce) {
    html { scroll-behavior:auto; }
    *, *::before, *::after { transition:none !important; animation:none !important; }
  }
}
