/*
Theme Name: Valis
Description: Valis Advisory theme, converted 1:1 from the approved static site. The rules below this comment are the original homepage stylesheet, unchanged.
Version: 1.0.2
Requires PHP: 7.4
Text Domain: valis
*/
/* Homepage: 1366x800 artboard scaled by --s, centred. Header/footer/pattern live in shared.css. */
@media(min-width:1024px) and (orientation:landscape),(min-width:1280px){
  body{height:100vh;display:flex;align-items:center;justify-content:center;position:relative}
  .stage{height:calc(800*var(--s))}
  .stage>.site-footer{position:absolute;left:0;top:calc(731*var(--s))}
  .hero-text{left:calc(184*var(--s));top:calc(250*var(--s));width:calc(860*var(--s))}
  .hero h1{font-weight:600;color:#2b2b2b;font-size:calc(35.9*var(--s));line-height:calc(45*var(--s));margin:0 0 calc(14*var(--s))}
  .hero p{font-size:calc(22.5*var(--s));line-height:calc(33*var(--s));margin:0 0 calc(12*var(--s))}
  .hero p+p{padding-left:calc(4*var(--s));margin-top:calc(26*var(--s))}
  .hero-chain{left:calc(827*var(--s));top:calc(258*var(--s));width:calc(360*var(--s));height:auto}
  .hero h1 br,.hero p br{display:inline}
}
@media(max-width:1023px),(max-width:1279px) and (orientation:portrait){
  .stage{min-height:100vh}
  .hero{padding:24px 0}
  .hero br{display:none}
  .hero h1{font-weight:600;color:#2b2b2b;font-size:22px;line-height:1.3}
  .hero p{font-size:16px;line-height:1.5}
  .hero-chain{display:block;width:220px;height:auto;margin:0 auto}
}
/* v9: pattern starts just under the heading; chain larger, top at heading line 1, over the pattern (transparent PNG, nothing masked) */
@media(min-width:1024px) and (orientation:landscape),(min-width:1280px){
  body:not(.inner) .band{top:calc(50vh + (270 - 400)*var(--s));-webkit-mask:linear-gradient(#0000 calc(20*var(--s)),#0004 calc(55*var(--s)),#000 calc(90*var(--s)));mask:linear-gradient(#0000 calc(20*var(--s)),#0004 calc(55*var(--s)),#000 calc(90*var(--s)))}
  .hero-chain{left:calc(829*var(--s));top:calc(260*var(--s));width:calc(360*var(--s))}
}
/* v10: paragraph rhythm matched to approved design ref at 1366x800 */
@media(min-width:1024px) and (orientation:landscape),(min-width:1280px){
  .hero h1{margin-bottom:calc(18*var(--s))}
  .hero p{line-height:calc(34.5*var(--s))}
  .hero p+p{margin-top:calc(20.5*var(--s))}
}
/* v10: pattern grid snapped to the artboard so chain loops sit concentric with circles (design ref: period 90.6, circle centre at x1142,y390) */
@media(min-width:1024px) and (orientation:landscape),(min-width:1280px){
  body:not(.inner) .band{background-size:calc(90.6*var(--s)) calc(90.6*var(--s));background-position:calc((100vw - 1366*var(--s))/2 + 9.5*var(--s)) calc(74.7*var(--s))}
}
/* v1.0.2 responsive */
@media(max-width:1023px),(max-width:1279px) and (orientation:portrait){
  .hero{max-width:640px;margin:0 auto}
  .hero-chain{width:min(240px,60vw)}
}
@media(min-width:600px) and (max-width:1279px) and (orientation:portrait){.hero h1{font-size:28px}.hero p{font-size:17px}}
