/* Layout for the comparison content. Brand elements come from clash-v2.css. */
.comparison-page h1,.comparison-page h2,.comparison-page h3{text-transform:uppercase}
.comparison-page .comparison-hero{max-width:none;margin:0;padding:170px 8vw 88px;background:linear-gradient(90deg,#110c17ed 0%,#110c17cf 55%,#110c1780 100%),url('/assets/clash-brand-arena-user.png') center/cover no-repeat}
.comparison-copy{max-width:1000px;margin:auto}
.comparison-copy .breadcrumb{font-size:14px;text-decoration:underline;text-underline-offset:4px}
.comparison-copy .event-kicker{margin-top:30px}
.comparison-copy h1{font-size:clamp(58px,6vw,94px);line-height:.95;margin:24px 0 30px;transform:rotate(-2deg);transform-origin:left center;text-shadow:0 5px 0 #21122d}
.comparison-copy p{max-width:740px;line-height:1.6}
.comparison-copy .lead{font:700 13px/1.5 var(--body);letter-spacing:.06em;text-transform:uppercase;max-width:64ch}
.comparison-copy>.paint-button{margin:30px 18px 0 0}
.comparison-page .paint-button{font-family:var(--display);font-weight:800;text-transform:uppercase}
.comparison-page .clash-action-icon img{object-fit:contain}
.comparison-page .event-section{font:500 17px/1.6 var(--body)}
.comparison-page .event-section h2{font-size:clamp(40px,4.8vw,72px);line-height:.98}
.comparison-page .event-section h3{font-size:clamp(28px,2.7vw,40px)}
.comparison-page .planning-grid{margin-top:36px;gap:36px 48px}
.comparison-page .planning-grid+p{margin-top:38px}
.comparison-page .planning-grid .paint-button{margin-top:24px}
.comparison-page .comparison-wrap{border:2px solid var(--purple);background:var(--ink)}
.comparison-page .comparison-table th{background:var(--ink);color:var(--paper)}
.comparison-page .comparison-table thead th{font:900 23px/1.15 var(--display);text-transform:uppercase;border-bottom:2px solid var(--purple)}
.comparison-page .comparison-table th,.comparison-page .comparison-table td{border-bottom-color:#f4e6ce33}
.comparison-page .comparison-table td:nth-child(2){background:#a570e81a}
.comparison-page .comparison-table caption{padding:14px 18px;margin:0;color:var(--paper)}
.comparison-page .comparison-sources{color:#ddc9ed}
.comparison-page .paper .event-kicker{color:#8444af}
@media(max-width:760px){
 .comparison-page .comparison-hero{padding:130px 6vw 52px;background-position:60% center}
 .comparison-copy h1{font-size:clamp(46px,11.6vw,64px);margin-top:20px}
 .comparison-copy>.paint-button{display:flex!important;width:fit-content;margin:22px 0 0}
 .comparison-page .comparison-wrap{margin-right:0;padding-right:0}
 .comparison-page .event-section h2{font-size:clamp(36px,9vw,48px)}
 .comparison-page .planning-grid{gap:30px}
}
@media(max-width:380px){
 .comparison-page .site-header .small .art-button-content{display:flex}
 .comparison-page .site-header .small .button-label{display:block}
}
@media(prefers-reduced-motion:reduce){.comparison-page .paint-button{transition:none}}
