/*
  MazeLabs — template de case (dist/cases/*.html)
  Gerado a partir de generate-cases.mjs + cases-data.mjs. Carregado ANTES de
  site.css, portanto site.css vence em seletores iguais (.shell, .nav…).
  Cores e raios vêm de tokens.css.
*/
.link-icon,.nav-icon{display:inline-block;width:1em;height:1em;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;vertical-align:-.12em;flex:none}
.source,.video-section p a,.nav-links a:last-child,.after-inner a,.case-nav a{display:inline-flex!important;align-items:center;gap:.45em}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--font-body)}
a{color:inherit}
img{max-width:100%}
::selection{background:var(--accent);color:var(--white)}
.shell{width:min(1320px,calc(100% - 76px));margin:auto}
.skip{position:absolute;left:-9999px;top:0;background:var(--white);color:var(--ink-900);padding:12px;z-index:20}
.skip:focus{left:10px}
.nav{background:var(--ink-900);color:var(--white)}
.nav-inner{height:78px;display:flex;align-items:center;justify-content:space-between;gap:25px}
.brand img{display:block;width:174px;height:auto}
.nav-links{display:flex;align-items:center;gap:27px}
.nav-links a{text-decoration:none;font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:.08em}
.nav-links a:hover{color:var(--accent-text)}
.nav-links a:last-child{border:1px solid var(--white-a33);padding:11px 15px;border-radius:30px}
.case-top{background:var(--ink-900);color:var(--white);padding:45px 0 84px}
.crumb{display:flex;gap:10px;color:var(--gray-400);font-size:12px}
.crumb a{text-decoration:none}
.crumb a:hover{color:var(--white)}
.case-header{display:grid;grid-template-columns:1fr .9fr;align-items:end;gap:45px;margin-top:80px}
.category{font-size:12px;letter-spacing:.17em;text-transform:uppercase;font-weight:700;color:var(--blue-300)}
.case-header h1{font-family:var(--font-display);font-weight:600;letter-spacing:-.075em;font-size:clamp(54px,6.2vw,104px);line-height:.98;margin:17px 0 0}
.case-header p{font-size:clamp(18px,1.9vw,26px);line-height:1.42;letter-spacing:-.02em;color:var(--gray-200);max-width:530px;margin:0 0 8px}
.hero-media{background:var(--ink-700);min-height:480px;display:grid;place-items:center;overflow:hidden;position:relative}
.hero-media img{display:block;width:100%;height:540px;object-fit:cover}
/* Gradiente da marca licenciada Barbie/Hot Wheels: token local, fora da paleta MazeLabs */
.hero-media.phone{--licensed-pink-from:#ff9dcf;--licensed-pink-to:#cf167e;background:linear-gradient(130deg,var(--licensed-pink-from),var(--licensed-pink-to))}
.hero-media.phone img{width:auto;max-width:100%;height:530px;object-fit:contain}
.hero-caption{font-size:12px;color:var(--gray-500);padding:12px 0 0}
.article-layout{display:grid;grid-template-columns:minmax(0,760px) 250px;justify-content:space-between;gap:70px;padding:95px 0 110px}
.article-main{min-width:0}
.intro{font-family:var(--font-display);font-size:clamp(20px,2vw,26px);line-height:1.35;letter-spacing:-.015em;margin:0 0 78px}
.story-section{border-top:1px solid var(--line);padding:37px 0 50px;scroll-margin-top:30px}
.section-number{font-size:11px;color:var(--accent-text);font-weight:700;letter-spacing:.15em}
.story-section h2,.section-title h2{font-family:var(--font-display);font-size:clamp(31px,3.5vw,48px);line-height:1.08;letter-spacing:-.06em;margin:15px 0 22px}
.story-section p{font-size:17px;line-height:1.75;color:var(--gray-700);margin:0 0 17px}
.side{align-self:start;position:sticky;top:30px;border-top:2px solid var(--accent);padding-top:22px}
.side-title{font-size:11px;font-weight:700;letter-spacing:.15em;text-transform:uppercase;color:var(--accent-text)}
.side ol{list-style:none;padding:0;margin:17px 0 30px}
.side li+li{margin-top:12px}
.side li a{text-decoration:none;color:var(--gray-700);font-size:14px}
.side li a:hover{color:var(--accent-text)}
.source{display:block;padding-top:20px;border-top:1px solid var(--line);font-weight:700;text-decoration:none;font-size:13px}
.source:hover{color:var(--accent-text)}
.gallery,.video-section{padding:88px 0 105px;border-top:1px solid var(--line)}
.section-title span{font-size:12px;color:var(--accent-text);text-transform:uppercase;font-weight:700;letter-spacing:.16em}
.section-title h2{margin:12px 0 32px}
.gallery-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:22px}
.gallery-grid figure{margin:0;background:var(--paper-200);min-width:0}
.gallery-grid figure:first-child:nth-last-child(3){grid-column:span 2}
.gallery-grid img{display:block;width:100%;height:440px;object-fit:contain;background:var(--line-200)}
.gallery-grid figure:first-child:nth-last-child(3) img{height:520px}
.gallery-grid figcaption{font-size:12px;color:var(--gray-600);padding:12px 14px 15px}
.video-frame{position:relative;aspect-ratio:16/9;background:var(--ink-900);border-radius:4px;overflow:hidden}
.video-frame iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.video-section p{color:var(--gray-600);font-size:14px;margin-top:15px}
.video-section a{font-weight:700}
.after-case{background:var(--ink-850);color:var(--white);padding:90px 0}
.after-inner{display:flex;align-items:end;justify-content:space-between;gap:55px}
.after-inner h2{font-family:var(--font-display);font-size:clamp(38px,4vw,62px);letter-spacing:-.06em;line-height:1.05;max-width:690px;margin:0}
.after-inner p{color:var(--gray-200);max-width:390px;line-height:1.6;margin:16px 0 0}
.after-inner a{display:inline-block;background:var(--accent);color:var(--on-accent);padding:16px 24px;border-radius:30px;font-weight:700;text-decoration:none;white-space:nowrap}
.case-nav{display:flex;justify-content:space-between;gap:20px;padding:30px 0;font-size:13px;font-weight:700}
.case-nav a{text-decoration:none}
.case-nav a:hover{color:var(--accent-text)}
footer{background:var(--ink-900);color:var(--gray-400);padding:25px 0}
.footer-inner{display:flex;align-items:center;justify-content:space-between;gap:20px;font-size:12px}
.footer-inner img{width:140px;height:auto;display:block}
@media(max-width:900px){
.case-header{grid-template-columns:1fr;gap:25px;margin-top:55px}
.case-header p{max-width:700px}
.article-layout{grid-template-columns:1fr;gap:0}
.side{position:static;grid-row:1;margin-bottom:65px}
.side ol{display:flex;flex-wrap:wrap;gap:9px 22px}
.side li+li{margin:0}
.after-inner{display:block}
.after-inner a{margin-top:26px}
}
@media(max-width:620px){
.shell{width:calc(100% - 36px)}
.nav-inner{height:67px}
.brand img{width:148px}
.nav-links{gap:12px}
.nav-links a:first-child{display:none}
.nav-links a{font-size:10px}
.nav-links a:last-child{padding:9px 11px}
.case-top{padding:29px 0 55px}
.case-header{margin-top:55px}
.case-header h1{font-size:clamp(49px,13vw,70px)}
.case-header p{font-size:18px}
.hero-media{min-height:300px}
.hero-media img{height:360px}
.hero-media.phone img{height:360px}
.article-layout{padding:65px 0 80px}
.intro{margin-bottom:55px}
.story-section p{font-size:16px}
.gallery,.video-section{padding:65px 0 75px}
.gallery-grid{grid-template-columns:1fr}
.gallery-grid figure:first-child:nth-last-child(3){grid-column:auto}
.gallery-grid img,.gallery-grid figure:first-child:nth-last-child(3) img{height:320px}
.after-case{padding:70px 0}
.case-nav{font-size:12px}
.footer-inner{display:block}
.footer-inner span{display:block;margin-top:15px}
}
@media(prefers-reduced-motion:reduce){
html{scroll-behavior:auto}
}