/* One shared frame keeps the panoramic scene, navigation and content aligned. */
#moto-atelier{
 --page-gutter:clamp(18px,5.8vw,112px);
 --content-width:1680px;
 --frame-inset:max(var(--page-gutter),calc((100% - var(--content-width))/2));
 max-width:none;
}
#moto-atelier .ma-header,
#moto-atelier .ma-topline,
#moto-atelier .ma-makes,
#moto-atelier .ma-contact,
#moto-atelier .ma-footer{padding-inline:var(--frame-inset)}
#moto-atelier .ma-hero,
#moto-atelier .ma-showroom,
#moto-atelier .ma-content{
 width:calc(100% - 2*var(--page-gutter));
 max-width:var(--content-width);
 margin-inline:auto;
}
#moto-atelier .ma-hero{
 height:auto;
 min-height:0;
 aspect-ratio:1921/819;
 padding:20px 0;
 background:#262815;
 border-bottom:1px solid #45562d;
}
#moto-atelier .ma-hero:before{display:none}
#moto-atelier .ma-scene{inset:0}
#moto-atelier .ma-scene img{object-fit:cover;object-position:center;width:100%;height:100%}
#moto-atelier .ma-hero:after{
 display:block;
 background:linear-gradient(90deg,transparent 24%,#0a12091c 35%,#0a120952 48%,#0a120952 52%,#0a12091c 65%,transparent 76%),linear-gradient(0deg,#0b0e0d66,transparent 20%);
}
#moto-atelier .ma-hero-copy{
 width:36%;max-width:450px;min-width:0;
 padding:18px 10px;
 background:none;border-radius:0;
 text-align:center;
}
#moto-atelier .ma-hero h1{font-size:clamp(58px,4.1vw,78px);line-height:.95;margin-bottom:20px;text-shadow:0 3px 24px #10200bd9}
#moto-atelier .ma-hero .ma-kicker{font-size:9px;letter-spacing:1.5px;margin:0 auto 18px;max-width:100%;text-shadow:0 1px 8px #152608}
#moto-atelier .ma-hero .ma-intro{font-size:14px;line-height:1.75;margin-bottom:22px;max-width:365px;text-shadow:0 1px 8px #000}
#moto-atelier .ma-hero .ma-actions{gap:9px;flex-wrap:wrap}
#moto-atelier .ma-hero .ma-primary,#moto-atelier .ma-hero .ma-secondary{font-size:12px;min-height:48px;padding:12px 14px;gap:12px}
#moto-atelier .ma-hero .ma-underhero{margin-top:18px;line-height:1.6}
#moto-atelier .ma-showroom{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(28px,6vw,90px);padding:64px 0 44px;background:radial-gradient(ellipse at 75% 15%,#28401e35,transparent 65%);border-top:0}
#moto-atelier .ma-content{padding:36px 0 42px;background:radial-gradient(ellipse at 90% 45%,#30472318,transparent 55%)}
#moto-atelier .ma-service-layout,#moto-atelier .ma-workshop{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
#moto-atelier .ma-showroom-copy,#moto-atelier .ma-showcase,#moto-atelier .ma-service-details,#moto-atelier .ma-edm-media{min-width:0}
@media(min-width:821px){
 #moto-atelier .ma-header{display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);gap:24px}
 #moto-atelier .ma-brand{justify-self:start}
 #moto-atelier .ma-nav{justify-self:center;gap:22px}
 #moto-atelier .ma-lang{justify-self:end;margin-left:0}
}
@media(min-width:1101px) and (max-width:1350px){
 #moto-atelier .ma-hero-copy{width:38%;padding:10px}
 #moto-atelier .ma-hero h1{font-size:59px;margin-bottom:14px}
 #moto-atelier .ma-hero .ma-intro{font-size:12px;line-height:1.65;margin-bottom:15px}
 #moto-atelier .ma-hero .ma-kicker{font-size:8px;margin-bottom:15px;letter-spacing:.9px}
 #moto-atelier .ma-hero .ma-primary,#moto-atelier .ma-hero .ma-secondary{padding:11px;font-size:11px;min-height:43px;gap:8px}
 #moto-atelier .ma-hero .ma-underhero{font-size:7px;margin-top:13px}
 #moto-atelier .ma-nav{gap:15px}
}
@media(max-width:1100px){
 #moto-atelier .ma-hero{aspect-ratio:auto;display:flex;flex-direction:column;height:auto;min-height:0;padding:0;background:#10160e}
 #moto-atelier .ma-hero:after{display:none}
 #moto-atelier .ma-scene{position:relative;inset:auto;width:100%;height:560px;z-index:0}
 #moto-atelier .ma-scene img{object-fit:cover;object-position:88% center}
 #moto-atelier .ma-scene:after{background:linear-gradient(0deg,#10160e,transparent 22%)}
 #moto-atelier .ma-hero-copy{width:100%;max-width:660px;padding:8px 24px 30px;background:transparent}
 #moto-atelier .ma-hero h1{font-size:72px}
 #moto-atelier .ma-hero .ma-intro{font-size:16px;max-width:480px}
 #moto-atelier .ma-hero .ma-primary,#moto-atelier .ma-hero .ma-secondary{font-size:14px;padding:15px 18px}
 #moto-atelier .ma-showroom{padding-top:48px}
}
@media(max-width:820px){
 #moto-atelier .ma-header{display:flex;gap:14px}
 #moto-atelier .ma-lang{margin-left:auto}
 #moto-atelier .ma-nav{padding-top:12px}
 #moto-atelier .ma-scene{height:520px}
}
@media(max-width:700px){
 #moto-atelier .ma-showroom{grid-template-columns:minmax(0,1fr);gap:48px;padding-top:32px}
 #moto-atelier .ma-service-layout,#moto-atelier .ma-workshop{grid-template-columns:minmax(0,1fr)}
}
@media(max-width:580px){
 #moto-atelier{--page-gutter:16px}
 #moto-atelier .ma-header{gap:9px;padding-block:16px}
 #moto-atelier .ma-hero{border-bottom:0}
 #moto-atelier .ma-scene{height:460px}
 #moto-atelier .ma-scene img{object-position:88% center}
 #moto-atelier .ma-hero-copy{padding:8px 12px 25px}
 #moto-atelier .ma-hero h1{font-size:62px}
 #moto-atelier .ma-hero .ma-intro{font-size:15px}
 #moto-atelier .ma-hero .ma-kicker{font-size:8px;letter-spacing:1px}
 #moto-atelier .ma-hero .ma-actions{flex-direction:column;align-items:stretch}
 #moto-atelier .ma-showroom{padding-bottom:32px}
 #moto-atelier .ma-content{padding-top:25px}
 #moto-atelier .ma-makes{gap:12px}
 #moto-atelier .ma-makes button{font-size:21px}
}
@media(max-width:360px){
 #moto-atelier{--page-gutter:12px}
 #moto-atelier .ma-header{gap:7px}
 #moto-atelier .ma-scene{height:430px}
 #moto-atelier .ma-hero h1{font-size:56px}
 #moto-atelier .ma-makes button{font-size:18px}
}
