﻿.article-header{
  position:relative;
  overflow:hidden;
  padding:120px 60px 48px;
  background:linear-gradient(180deg,#111 0%,var(--black) 100%);
  border-bottom:none;
}
.article-header-inner{position:relative;z-index:2;max-width:920px}
.back-link{
  font-family:var(--font-display);
  font-size:var(--typ-small);
  font-weight:600;
  letter-spacing:0.18em;
  text-transform:uppercase;
  color:var(--white);
  text-decoration:none;
  display:inline-flex;
  align-items:center;
  gap:10px;
  margin-bottom:28px;
  transition:color 0.2s;
}
.back-link svg{flex-shrink:0}
.back-link:hover{color:var(--yellow)}
.article-title{
  font-family:var(--font-display);
  font-size:var(--typ-subheading);
  font-weight:900;
  text-transform:uppercase;
  line-height:1;
  letter-spacing:-0.01em;
  color:var(--white);
  max-width:900px;
  padding-bottom:8px;
}

.article-body-wrap{
  background:#fff;
  color:#1a1a1a;
}
.article-layout{
  display:grid;
  grid-template-columns:minmax(0,1fr) 300px;
  gap:56px;
  padding:48px 60px 80px;
  align-items:start;
  max-width:1280px;
  margin:0 auto;
  background:var(--form-bg);
}
.article-img{
  width:100%;
  aspect-ratio:16/9;
  background:#eee;
  overflow:hidden;
  margin-bottom:32px;
}
.article-img img{width:100%;height:100%;object-fit:cover;display:block}
.article-img-placeholder{
  width:100%;
  height:100%;
  min-height:240px;
  background:linear-gradient(145deg,#f0f0f0,#e4e4e4);
}

.article-body{
  font-family:var(--font-body);
  font-size:var(--typ-body);
  font-weight:400;
  line-height:1.85;
  color:var(--text-dark-sub);
}
.article-body,
.article-body p,
.article-body span,
.article-body li{
  font-family:var(--font-body)!important;
  font-size:var(--typ-body)!important;
  color:var(--text-dark-sub)!important;
}
.article-body p{
  margin-bottom:18px;
}
.article-body p:first-child strong,
.article-body > p:first-child{
  color:var(--text-dark)!important;
}
.article-body h2,
.article-body h3{
  font-family:var(--font-display);
  font-size:var(--typ-title);
  font-weight:900;
  text-transform:uppercase;
  color:var(--text-dark);
  margin:32px 0 12px;
  letter-spacing:0.02em;
}
.article-body strong{color:var(--text-dark)!important;font-weight:700}
.article-body ul{
  margin:0 0 20px;
  padding-left:1.2em;
  list-style:disc;
  display:block;
}
.article-body ul li{
  padding-left:0;
  position:static;
  margin-bottom:8px;
}
.article-body ul li::before{content:none}
.article-body a{color:var(--text-dark)!important;font-weight:700;text-decoration:underline}
.article-body a:hover{color:var(--yellow)!important}

.back-link-bottom{
  font-family:var(--font-display);
  font-size:var(--typ-small);
  font-weight:600;
  letter-spacing:0.18em;
  text-transform:uppercase;
  color:var(--text-dark);
  text-decoration:none;
  display:inline-flex;
  align-items:center;
  gap:10px;
  margin-top:40px;
  padding-top:28px;
  border-top:1px solid #e5e5e5;
  transition:color 0.2s;
}
.back-link-bottom:hover{color:var(--yellow)}

.article-sidebar{position:sticky;top:96px}
.sidebar-section{
  margin-bottom:28px;
  padding-bottom:28px;
  border-bottom:1px solid #e5e5e5;
}
.sidebar-title{
  font-family:var(--font-display);
  font-size:var(--typ-small);
  font-weight:800;
  letter-spacing:0.28em;
  text-transform:uppercase;
  color:var(--text-dark);
  margin-bottom:18px;
  display:flex;
  align-items:center;
  gap:12px;
}
.sidebar-title::after{
  content:'';
  flex:1;
  height:1px;
  background:#d8d8d8;
}
.other-news-item{
  display:flex;
  flex-direction:column;
  gap:4px;
  padding:14px 0;
  border-bottom:1px solid #eee;
  text-decoration:none;
  color:inherit;
  transition:opacity 0.2s;
}
.other-news-item:last-child{border-bottom:none}
.other-news-item:hover{opacity:0.7}
.other-news-date{
  font-family:var(--font-display);
  font-size:var(--typ-small);
  font-weight:600;
  letter-spacing:0.12em;
  text-transform:uppercase;
  color:#999;
  display:flex;
  align-items:center;
  gap:8px;
  flex-wrap:wrap;
}
.other-news-date-dot{
  width:3px;
  height:3px;
  border-radius:50%;
  background:#bbb;
  flex-shrink:0;
}
.other-news-title{
  font-family:var(--font-display);
  font-size:var(--typ-body);
  font-weight:800;
  text-transform:uppercase;
  line-height:1.25;
  color:var(--text-dark);
}

.newsletter-box{
  background:var(--form-bg);
  border:1px solid #e0e0e0;
  padding:24px;
}
.newsletter-title{
  font-family:var(--font-display);
  font-size:var(--typ-title);
  font-weight:900;
  text-transform:uppercase;
  color:var(--text-dark);
  margin-bottom:8px;
}
.newsletter-sub{
  font-size:var(--typ-body);
  font-weight:400;
  color:var(--text-dark-muted);
  line-height:1.6;
  margin-bottom:16px;
}
.newsletter-forms-wrap .umbraco-forms-form{margin:0}
.newsletter-forms-wrap .umbraco-forms-page,
.newsletter-forms-wrap .umbraco-forms-fieldset{display:block;margin:0;padding:0;border:0}
.newsletter-forms-wrap .form-field{margin-bottom:10px}
.newsletter-forms-wrap .form-label{
  position:absolute;
  width:1px;
  height:1px;
  padding:0;
  margin:-1px;
  overflow:hidden;
  clip:rect(0,0,0,0);
  white-space:nowrap;
  border:0;
}
.newsletter-forms-wrap .form-input{
  width:100%;
  padding:12px 14px;
  background:#E5E5E5;
  border:1px solid #ddd;
  color:var(--text-dark);
  font-family:var(--font-body);
  font-size:var(--typ-small);
  outline:none;
  transition:border-color 0.2s;
}
.newsletter-forms-wrap .form-input:focus{border-color:var(--yellow)}
.newsletter-forms-wrap .form-input::placeholder{color:#999}
.newsletter-forms-wrap .field-validation-error,
.newsletter-forms-wrap .validation-summary-errors{
  color:#c00;
  font-family:var(--font-body);
  font-size:var(--typ-small);
  margin-top:6px;
}
.newsletter-forms-wrap .validation-summary-errors{margin-bottom:10px;padding:0;list-style:none}
.newsletter-forms-wrap .umbraco-forms-hidden{display:none!important}
.newsletter-forms-wrap .pdpa-note{display:none}
.newsletter-forms-wrap .submit-btn{
  width:100%;
  padding:14px 44px 14px 14px;
  background:var(--yellow) url('/images/arrow-right.svg') no-repeat right 16px center / 1.125em;
  color:var(--black);
  font-family:var(--font-display);
  font-size:var(--typ-small);
  font-weight:800;
  letter-spacing:0.18em;
  text-transform:uppercase;
  border:none;
  cursor:pointer;
  margin-top:0;
  clip-path:polygon(0 0,calc(100% - 10px) 0,100% 10px,100% 100%,10px 100%,0 calc(100% - 10px));
  transition:transform 0.15s,filter 0.15s;
}
.newsletter-forms-wrap .submit-btn:hover{transform:translateY(-1px);filter:brightness(1.03)}

.visually-hidden{
  position:absolute;
  width:1px;
  height:1px;
  padding:0;
  margin:-1px;
  overflow:hidden;
  clip:rect(0,0,0,0);
  white-space:nowrap;
  border:0;
}

.hero-bg-grad{
  background:transparent
}

@media(max-width:1024px){
  .article-header{padding:100px 32px 40px}
  .article-layout{grid-template-columns:1fr;gap:40px;padding:40px 32px 60px}
  .article-sidebar{position:static}
}
@media(max-width:768px){
  .article-header{padding:90px 20px 32px}
  .article-layout{padding:32px 20px 48px}
}
