

/* Start:/local/components/adojapan/auto.stories/templates/.default/style.css?17910313628972*/
.as-stories { --as-blue:#1941cf; --as-ink:#111b30; --as-muted:#57677f; --as-line:#dce4ef; --as-inset:116px; box-sizing:border-box; width:min(1280px,calc(100% - 64px)); margin:0 auto; padding:28px 0 72px; color:var(--as-ink); font:400 17px/1.65 'IBM Plex Sans',Arial,sans-serif; }
.as-stories *, .as-stories *::before, .as-stories *::after { box-sizing:border-box; }
.as-stories [hidden] { display:none !important; }
/* Ranx hides every header on mobile; editorial headings must stay visible. */
.as-stories > .as-list-heading, .as-stories > .as-story-heading { display:block !important; }
.as-stories a { color:var(--as-blue); text-decoration:none; }
.as-stories a:hover { text-decoration:underline; }
.as-stories :focus-visible { outline:3px solid var(--as-blue); outline-offset:4px; }
.as-stories h1, .as-stories h2, .as-stories h3, .as-stories p, .as-stories figure { margin:0; padding:0; }
.as-stories h1, .as-stories h2, .as-stories h3 { font-family:inherit; color:var(--as-ink); font-weight:600; }
.as-stories h1 { font-size:clamp(32px,3.5vw,48px); line-height:1.13; letter-spacing:-1px; }
.as-stories h2 { font-size:29px; line-height:1.25; letter-spacing:-.4px; }
.as-breadcrumb { display:flex; flex-wrap:wrap; gap:8px 11px; color:var(--as-muted); font-size:13px; line-height:1.5; overflow-wrap:anywhere; }
.as-breadcrumb a { color:var(--as-muted); }
.as-stories .as-eyebrow { color:var(--as-blue); font-size:12px; font-weight:600; text-transform:uppercase; letter-spacing:1.2px; margin-bottom:12px; }
.as-stories .as-lead { color:var(--as-muted); font-size:21px; line-height:1.5; max-width:830px; margin-top:20px; }
.as-list-heading { padding:40px 0 36px; }
.as-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:32px; }
.as-card { min-width:0; border:1px solid var(--as-line); border-radius:14px; overflow:hidden; background:#fff; }
.as-card-cover { display:block; aspect-ratio:16/10; background:#edf2ff; overflow:hidden; }
.as-card-cover img { display:block; width:100%; height:100%; object-fit:cover; }
.as-cover-label { display:grid; height:100%; place-items:center; font-size:20px; color:var(--as-muted); }
.as-card-copy { padding:28px; display:flex; flex-direction:column; align-items:flex-start; }
.as-card-copy h2 { font-size:27px; line-height:1.25; }
.as-card-copy h2 a { color:var(--as-ink); }
.as-card-copy p { color:var(--as-muted); margin:18px 0 24px; font-size:17px; line-height:1.6; }
.as-read-link { display:inline-flex; align-items:center; gap:16px; margin-top:auto; font-size:16px; font-weight:500; }
.as-grid[data-count="1"] { grid-template-columns:1fr; }
.as-grid[data-count="1"] .as-card { display:grid; grid-template-columns:1.1fr 1fr; }
.as-grid[data-count="1"] .as-card-cover { height:100%; min-height:320px; aspect-ratio:auto; }
.as-grid[data-count="1"] .as-card-copy { padding:38px; justify-content:center; }
.as-grid[data-count="1"] .as-read-link { margin-top:8px; }
.as-pagination { margin:34px 0 0; }
.as-pages { display:flex; flex-wrap:wrap; align-items:center; gap:8px; font-size:15px; }
.as-pages a, .as-pages span { display:inline-flex; justify-content:center; align-items:center; min-height:44px; min-width:44px; padding:6px 12px; border:1px solid var(--as-line); border-radius:8px; }
.as-pages [aria-current] { background:var(--as-blue); color:#fff; border-color:var(--as-blue); }
.as-empty { padding:28px; background:#f6f8fc; border:1px solid var(--as-line); border-radius:12px; color:var(--as-muted); }
.as-back { display:inline-flex; gap:12px; align-items:center; font-size:14px; margin-top:26px; }
.as-story-heading { padding:30px 0 32px; max-width:1060px; }
.as-hero-image { margin:0 0 40px !important; border:1px solid var(--as-line); border-radius:14px; overflow:hidden; background:#f6f8fc; }
.as-hero-image img { display:block; width:100%; height:auto; max-height:680px; object-fit:contain; }
.as-story-layout { max-width:860px; margin:0 auto; }
.as-has-contents .as-story-layout { display:grid; grid-template-columns:230px minmax(0,1fr); gap:48px; max-width:none; }
.as-contents { position:sticky; top:var(--as-inset); align-self:start; max-height:calc(100vh - var(--as-inset) - 24px); overflow:auto; padding-right:12px; }
.as-contents h2 { font-size:15px; margin-bottom:17px; letter-spacing:0; }
.as-contents ol { list-style:none; padding:0; margin:0; border-left:1px solid var(--as-line); }
.as-contents li { list-style:none; padding:0; margin:0; }
.as-contents li::before { display:none; }
.as-contents a { display:block; padding:10px 12px; color:var(--as-muted); font-size:14px; line-height:1.5; border-left:3px solid transparent; margin-left:-1px; border-radius:0 7px 7px 0; }
.as-contents a:hover, .as-contents a:focus-visible { color:var(--as-blue); background:#edf2ff; border-left-color:var(--as-blue); text-decoration:none; }
.as-story-body { min-width:0; overflow-wrap:anywhere; }
.as-story-body > :first-child { margin-top:0; }
.as-story-body h2 { margin:44px 0 20px; scroll-margin-top:var(--as-inset); }
.as-story-body h3 { margin:30px 0 14px; font-size:22px; line-height:1.35; scroll-margin-top:var(--as-inset); }
.as-story-body p { margin:18px 0; }
.as-story-body ul, .as-story-body ol { padding-left:24px; margin:20px 0; }
.as-story-body li { margin:9px 0; }
.as-story-body img, .as-story-body video { display:block; width:100%; max-width:100%; height:auto; border-radius:10px; }
.as-story-body img { object-fit:contain; background:#f6f8fc; }
.as-story-body figure { margin:28px 0; }
.as-story-body figcaption { font-size:13px; line-height:1.55; color:var(--as-muted); margin-top:12px; }
.as-story-body blockquote { border-left:3px solid var(--as-blue); padding:16px 22px; margin:26px 0; background:#eef3ff; border-radius:0 10px 10px 0; }
.as-story-body blockquote p { margin:0; }
.as-story-body table { display:block; overflow-x:auto; border-collapse:collapse; max-width:100%; margin:26px 0; font-size:15px; }
.as-story-body th, .as-story-body td { padding:12px; border:1px solid var(--as-line); text-align:left; }
.as-story-body details { border:1px solid var(--as-line); border-radius:10px; padding:16px 20px; margin:24px 0; }
.as-story-body summary { cursor:pointer; color:var(--as-blue); font-weight:500; }
.as-story-body .story-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:18px; }
.as-story-body .story-grid figure { margin:0; }
.as-video { padding:0; }
.as-story-body video { background:#0f1728; }
.as-video-download { display:inline-flex; padding:10px 0; font-size:14px; min-height:44px; }
.as-cta { margin-top:48px; display:flex; align-items:center; justify-content:space-between; gap:32px; padding:34px 38px; border:1px solid #d3ddfa; border-radius:14px; background:#f2f5ff; }
.as-cta h2 { font-size:26px; }
.as-cta p { color:var(--as-muted); font-size:16px; margin-top:10px; }
.as-stories .as-button { display:inline-flex; flex-shrink:0; gap:18px; align-items:center; justify-content:center; padding:13px 20px; border-radius:8px; background:var(--as-blue); color:#fff; font-size:15px; font-weight:500; min-height:48px; }
.as-stories .as-button:hover { background:#1234b4; color:#fff; text-decoration:none; }
.as-bottom-back { margin-top:28px; }
@media (max-width:1023px) { .as-has-contents .as-story-layout { grid-template-columns:200px minmax(0,1fr); gap:30px; } .as-card-copy { padding:24px; } .as-grid[data-count="1"] .as-card-copy { padding:28px; } .as-cta { align-items:flex-start; padding:28px; } }
@media (max-width:767px) { .as-stories { width:calc(100% - 32px); padding:22px 0 48px; font-size:16px; } .as-stories h1 { font-size:32px; line-height:1.16; letter-spacing:-.5px; } .as-stories .as-lead { font-size:18px; margin-top:16px; } .as-list-heading { padding:30px 0 28px; } .as-grid, .as-grid[data-count="1"] .as-card { display:grid; grid-template-columns:1fr; gap:24px; } .as-grid[data-count="1"] .as-card { gap:0; } .as-grid[data-count="1"] .as-card-cover { min-height:0; height:auto; aspect-ratio:16/10; } .as-grid[data-count="1"] .as-card-copy, .as-card-copy { padding:24px; } .as-card-copy h2 { font-size:25px; } .as-card-copy p { font-size:16px; margin:15px 0 20px; } .as-story-heading { padding:25px 0 26px; } .as-hero-image { margin-bottom:30px !important; } .as-has-contents .as-story-layout { display:block; } .as-contents { position:static; max-height:none; padding:0; margin:0 0 30px; } .as-contents ol { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); border:1px solid var(--as-line); border-radius:10px; overflow:hidden; } .as-contents a { height:100%; margin:0; border:0; padding:11px 12px; font-size:13px; } .as-stories .as-contents h2 { font-size:18px; } .as-story-body h2 { font-size:26px; margin-top:36px; } .as-story-body h3 { font-size:21px; } .as-story-body .story-grid { gap:12px; } .as-cta { display:block; padding:25px; margin-top:36px; } .as-cta h2 { font-size:24px; } .as-stories .as-button { margin-top:20px; } }
@media (prefers-reduced-motion:reduce) { .as-stories { scroll-behavior:auto; } }

/* End */
/* /local/components/adojapan/auto.stories/templates/.default/style.css?17910313628972 */
