/* AUT-03 赛道杂志 — bold motorsport editorial: oversized type, strict grid, one accent. */
.tpl-aut-03{--gut:clamp(16px,4vw,64px);--max:1440px;--pad-x:max(var(--gut),calc((100% - var(--max))/2));--display:"Archivo","Noto Sans SC",system-ui,sans-serif;--text:"Inter Tight","Noto Sans SC",system-ui,sans-serif;--rule:1.5px solid var(--fg);font-family:var(--text);font-size:16px;line-height:1.65;font-synthesis-weight:none}
.tpl-aut-03 main{overflow-x:clip}
.tpl-aut-03 ::selection{background:var(--accent);color:var(--on-accent)}
.tpl-aut-03 h1,.tpl-aut-03 h2,.tpl-aut-03 h3{font-family:var(--display);font-weight:800;letter-spacing:-.035em}
:lang(zh-Hans) .tpl-aut-03 h2,:lang(zh-Hans) .tpl-aut-03 h3{font-weight:600;letter-spacing:-.01em}
:lang(zh-Hans) .tpl-aut-03 h1,:lang(zh-Hans) .tpl-aut-03 h2{word-break:keep-all}
.tpl-aut-03 main>section{padding:clamp(80px,10vw,152px) var(--pad-x)}

/* masthead */
.a3-head{display:flex;align-items:center;gap:0 32px;flex-wrap:wrap;margin:0 var(--pad-x);padding:10px 0;border-bottom:var(--rule)}
.a3-brand{margin-right:auto;min-height:44px;display:flex;align-items:center;text-decoration:none;font-family:var(--display);font-weight:800;font-size:19px;letter-spacing:-.02em;text-transform:uppercase}
.a3-nav{display:flex;flex-wrap:wrap;gap:0 26px}
.a3-nav a{min-height:44px;display:inline-flex;align-items:center;text-decoration:none;font-size:13px;font-weight:600;letter-spacing:.06em;text-transform:uppercase}
.a3-nav a:hover{text-decoration:underline;text-decoration-thickness:2px;text-underline-offset:6px;text-decoration-color:var(--accent)}

/* hero: magazine cover */
.tpl-aut-03 main>.a3-hero{display:grid;grid-template-columns:minmax(0,1.32fr) minmax(0,1fr);gap:clamp(32px,4vw,64px);align-items:stretch;padding-top:clamp(32px,4vw,56px);padding-bottom:clamp(64px,8vw,120px)}
.a3-hero--text{grid-template-columns:minmax(0,1fr)!important}
.a3-hero-copy{display:flex;flex-direction:column;min-width:0}
.a3-eyebrow{margin:0 0 clamp(28px,5vw,72px);font-size:12.5px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--muted)}
.a3-hero h1{font-size:clamp(54px,10vw,156px);line-height:.88;letter-spacing:-.055em;text-transform:uppercase;margin-top:auto}
:lang(zh-Hans) .a3-hero h1{word-break:normal;overflow-wrap:normal}
.a3-rule{display:block;width:clamp(88px,12vw,168px);height:10px;margin:clamp(28px,3.4vw,44px) 0;background:var(--accent)}
.a3-hero-foot{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:24px 40px;align-items:end;padding-top:20px;border-top:var(--rule)}
.a3-sub{max-width:30em;font-size:clamp(16px,1.2vw,18px)}
.a3-sub p:last-child{margin:0}
.a3-actions{display:flex;flex-wrap:wrap;align-items:center;gap:8px 24px}
.a3-btn{display:inline-flex;align-items:center;justify-content:center;min-height:54px;padding:0 28px;background:var(--fg);color:var(--bg);text-decoration:none;font-family:var(--display);font-weight:700;font-size:15px;letter-spacing:.02em;text-transform:uppercase;transition:background .2s,color .2s}
.a3-btn:hover{background:var(--accent);color:var(--on-accent)}
.a3-link{min-height:44px;display:inline-flex;align-items:center;gap:6px;text-decoration:none;font-weight:600;font-size:14px;letter-spacing:.06em;text-transform:uppercase}
.a3-link:hover{color:var(--muted)}
.a3-hero-img{position:relative;min-height:100%;overflow:hidden;background:var(--soft)}
.a3-hero-img img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}

/* shared */
.a3-tag{display:flex;align-items:center;gap:12px;margin:0 0 22px;font-size:12.5px;font-weight:600;letter-spacing:.12em;text-transform:uppercase}
.a3-tag b{display:inline-grid;place-items:center;min-width:34px;height:24px;padding:0 6px;background:var(--accent);color:var(--on-accent);font-family:var(--display);font-weight:800;letter-spacing:0}
.a3-h2{font-size:clamp(34px,4.4vw,68px);line-height:1}
:lang(zh-Hans) .a3-h2{line-height:1.22}
.a3-intro{margin-top:22px;color:var(--muted);max-width:26em}
.a3-intro p:last-child{margin:0}
.a3-side{min-width:0}

/* services: ruled index beside a sticky heading */
.a3-services,.a3-faq,.a3-quotes{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.7fr);gap:40px clamp(40px,6vw,112px);align-items:start}
.a3-services .a3-side,.a3-faq .a3-side{position:sticky;top:24px}
.a3-list{border-top:var(--rule)}
.a3-row{display:grid;grid-template-columns:clamp(64px,7vw,104px) minmax(0,1fr) auto;gap:8px clamp(16px,2.4vw,40px);align-items:start;padding:clamp(22px,2.6vw,34px) 0;border-bottom:1px solid var(--line);transition:background .25s}
.a3-row-n{font-family:var(--display);font-weight:800;font-size:clamp(34px,3.6vw,56px);line-height:.9;letter-spacing:-.05em;color:var(--muted);transition:color .25s}
.a3-row:hover .a3-row-n{color:var(--fg)}
.a3-row h3{font-size:clamp(21px,1.9vw,27px);line-height:1.25;margin:2px 0 8px}
.a3-row-d{color:var(--muted);max-width:34em}
.a3-row-d p{margin:0}
.a3-price{margin:10px 0 0;font-family:var(--display);font-weight:700}
.a3-ask{min-height:44px;display:inline-flex;align-items:center;gap:6px;padding:0 4px;text-decoration:none;font-weight:600;font-size:13.5px;letter-spacing:.08em;text-transform:uppercase;white-space:nowrap;box-shadow:inset 0 -2px 0 var(--accent);transition:box-shadow .25s,color .25s}
.a3-ask:hover{box-shadow:inset 0 -44px 0 var(--accent);color:var(--on-accent)}

/* about: full-bleed process spread */
.tpl-aut-03 main>.a3-about{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);padding:0;background:var(--soft)}
.a3-about--text{grid-template-columns:minmax(0,1fr)!important}
.a3-about-img{position:relative;min-height:clamp(420px,52vw,820px);overflow:hidden}
.a3-about-img img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.a3-about-copy{align-self:center;padding:clamp(56px,8vw,128px) var(--gut) clamp(56px,8vw,128px) clamp(32px,6vw,112px);max-width:720px}
.a3-about--text .a3-about-copy{padding-left:var(--pad-x)}
.a3-about h2{margin-bottom:clamp(32px,4vw,56px)}
.a3-about-body{font-size:18px;color:var(--muted)}
.a3-steps{border-top:var(--rule)}
.a3-steps li{display:grid;grid-template-columns:clamp(72px,7vw,96px) minmax(0,1fr);gap:16px;align-items:baseline;padding:22px 0;border-bottom:1px solid var(--line)}
.a3-step-n{font-family:var(--display);font-weight:800;font-size:clamp(36px,3.6vw,52px);line-height:.9;letter-spacing:-.05em}
.a3-step-n i{font-style:normal;font-size:.36em;letter-spacing:0;color:var(--muted);margin-left:2px;vertical-align:top}
.a3-steps p{margin:0;font-size:clamp(17px,1.4vw,20px);font-weight:500}

/* gallery: magazine crops on a 12-col grid */
.a3-work-head{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,26em);gap:8px 48px;align-items:end;margin-bottom:clamp(36px,4vw,56px);padding-bottom:20px;border-bottom:var(--rule)}
.a3-work-head .a3-tag{grid-column:1/-1}
.a3-giant{font-size:clamp(56px,11vw,184px);line-height:.84;letter-spacing:-.06em;text-transform:uppercase}
:lang(zh-Hans) .a3-giant{font-size:clamp(48px,8.4vw,136px);line-height:1.06;letter-spacing:-.02em;font-weight:600}
.a3-work-head .a3-intro{margin:0}
.a3-grid{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:clamp(32px,3vw,48px) clamp(12px,1.4vw,20px)}
.a3-shot{grid-column:span 8}
.a3-shot:nth-child(4n+2){grid-column:span 4}
.a3-shot:nth-child(4n+3){grid-column:span 5}
.a3-shot:nth-child(4n+4){grid-column:span 7}
.a3-shot-img{overflow:hidden;background:var(--soft)}
.a3-shot-img img{width:100%;height:clamp(260px,36vw,560px);object-fit:cover;transition:transform .8s cubic-bezier(.2,.7,.2,1)}
.a3-shot:nth-child(4n+4) .a3-shot-img img{object-position:50% 70%!important}
.a3-shot:hover .a3-shot-img img{transform:scale(1.03)}
.a3-shot figcaption{display:flex;align-items:baseline;gap:14px;margin-top:12px;padding-top:10px;border-top:1px solid var(--line);font-size:14px;color:var(--muted)}
.a3-shot figcaption b{font-family:var(--display);font-weight:800;color:var(--fg)}
.a3-grid:has(.a3-shot:only-child) .a3-shot{grid-column:1/-1}

/* testimonials */
.a3-quote-list{display:grid;gap:0;border-top:var(--rule)}
.a3-quote-list figure{padding:28px 0;border-bottom:1px solid var(--line)}
.a3-quote-list blockquote{font-family:var(--display);font-weight:500;font-size:clamp(20px,2vw,28px);line-height:1.35;letter-spacing:-.02em}
.a3-quote-list blockquote p:last-child{margin:0}
.a3-quote-list figcaption{margin-top:12px;font-size:13px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}

/* faq */
.a3-faq{border-top:1px solid var(--line)}
.a3-faq-list{border-top:var(--rule)}
.a3-faq-list details{border-bottom:1px solid var(--line)}
.a3-faq-list summary{display:flex;justify-content:space-between;align-items:center;gap:20px;min-height:76px;padding:18px 0;font-family:var(--display);font-weight:600;font-size:clamp(18px,1.6vw,22px);letter-spacing:-.01em}
.a3-faq-list summary::after{float:none;flex:none;margin:0;font-family:var(--display);font-weight:400;font-size:28px;line-height:1}
.a3-faq-list details[open] summary::after{color:var(--accent)}
.a3-faq-list details p{margin:0 0 24px;max-width:38em;color:var(--muted)}

/* contact: the one solid accent block */
.tpl-aut-03 main>.a3-contact{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(0,1fr);gap:40px clamp(40px,6vw,112px);align-items:end;background:var(--accent);color:var(--on-accent);--line:color-mix(in srgb,var(--on-accent) 30%,transparent)}
.a3-contact .a3-tag b{background:var(--on-accent);color:var(--accent)}
.a3-contact-title{font-size:clamp(44px,7vw,120px);line-height:.92;letter-spacing:-.05em;color:inherit}
:lang(zh-Hans) .a3-contact-title{font-size:clamp(38px,5.6vw,92px);line-height:1.12;letter-spacing:-.02em;font-weight:600}
.a3-contact-intro{margin-top:24px;max-width:30em;font-size:17px}
.a3-contact-intro p:last-child{margin:0}
.a3-btn--inv{margin-top:36px;background:var(--on-accent);color:var(--accent)}
.a3-btn--inv:hover{background:var(--bg);color:var(--fg)}
.a3-contact-list{border-top:1.5px solid currentColor}
.a3-contact-list li{padding:16px 0;border-bottom:1px solid var(--line)}
.a3-contact-list .bc-k{font-weight:600;opacity:.8;margin-bottom:2px}
.a3-contact-list a{display:inline-flex;align-items:center;min-height:44px;margin:-8px 0;font-weight:600;text-decoration:none}
.a3-contact-list a:hover{text-decoration:underline}
.a3-social{display:flex;flex-wrap:wrap;gap:0 22px;margin-top:12px}
.a3-social a{min-height:44px;display:inline-flex;align-items:center;font-weight:700;text-transform:uppercase;font-size:13px;letter-spacing:.08em;text-decoration:none}

.a3-foot{display:flex;flex-wrap:wrap;justify-content:space-between;gap:8px 24px;margin:0 var(--pad-x);padding:24px 0 40px;font-size:13px;color:var(--muted)}
.a3-foot-brand{font-family:var(--display);font-weight:800;text-transform:uppercase;color:var(--fg)}

@media (max-width:1000px){
  .a3-services,.a3-faq,.a3-quotes{grid-template-columns:minmax(0,1fr)}
  .a3-services .a3-side,.a3-faq .a3-side{position:static}
  .tpl-aut-03 main>.a3-contact{grid-template-columns:minmax(0,1fr);align-items:start}
  .a3-hero-foot{grid-template-columns:minmax(0,1fr)}
}
@media (max-width:860px){
  .tpl-aut-03 main>.a3-hero{grid-template-columns:minmax(0,1fr)}
  .a3-hero-img{min-height:0}
  .a3-hero-img img{position:static;aspect-ratio:4/5;max-height:76svh}
  .tpl-aut-03 main>.a3-about{grid-template-columns:minmax(0,1fr)}
  .a3-about-img{min-height:0}
  .a3-about-img img{position:static;aspect-ratio:4/4.4}
  .a3-about-copy{padding:56px var(--gut)}
  .a3-work-head{grid-template-columns:minmax(0,1fr)}
}
@media (max-width:760px){
  .a3-head{gap:0 18px}
  .a3-nav{gap:0 16px}
  .a3-nav a{font-size:12px;letter-spacing:.04em}
  .a3-eyebrow{margin-bottom:28px;font-size:11.5px}
  .a3-hero h1{font-size:clamp(46px,17vw,104px)}
  .a3-rule{height:8px;margin:24px 0}
  .a3-row{grid-template-columns:52px minmax(0,1fr)}
  .a3-row .a3-ask{grid-column:2;justify-self:start;margin-top:4px}
  .a3-grid{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:28px 10px}
  .a3-shot,.a3-shot:nth-child(n){grid-column:1/-1}
  .a3-shot:nth-child(4n+2),.a3-shot:nth-child(4n+3){grid-column:span 1}
  .a3-shot-img img{height:auto;aspect-ratio:4/3}
  .a3-shot:nth-child(4n+2) .a3-shot-img img,.a3-shot:nth-child(4n+3) .a3-shot-img img{aspect-ratio:3/4}
  .a3-shot figcaption{font-size:13px;gap:8px}
}
