/*
Theme Name: JR Dimensions
Version: 1.2.0
Requires at least: 6.6
Requires PHP: 7.4
Text Domain: jr-dimensions
Description: JR Dimensionsin viisisivuinen yrityssivusto.
*/
:root{--navy:#0f2747;--blue:#2563eb;--muted:#556477;--line:#dce2e9;--pale:#f3f5f8}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:35px}body{margin:0;background:#fff;color:var(--navy);font-family:Arial,Helvetica,sans-serif;font-size:16px;line-height:1.65}a{color:inherit;text-decoration:none}a:focus-visible{outline:3px solid var(--blue);outline-offset:6px}.site-header{max-width:1440px;margin:auto;padding:27px 5%;display:flex;justify-content:space-between;align-items:center;gap:30px;border-bottom:1px solid var(--line)}.wordmark{font-size:23px;letter-spacing:-1px;line-height:1.2;white-space:nowrap}.wordmark strong{font-weight:800}.wordmark span{display:block;font-size:10px;letter-spacing:2.2px;margin-top:7px}nav{display:flex;align-items:center;gap:32px;font-size:14px;font-weight:500}.nav-cta{padding:12px 18px;border:1px solid var(--line)}.nav-cta span{margin-left:18px}nav a:hover{color:var(--blue)}.hero{max-width:1440px;margin:auto;display:grid;grid-template-columns:1.1fr 1fr;min-height:630px}.hero-main{padding:76px 6% 36px 9%}.eyebrow{font-size:12px;font-weight:600;letter-spacing:2px;margin:0 0 27px;color:var(--blue)}h1{font-size:clamp(42px,4.65vw,68px);font-weight:600;letter-spacing:-3.5px;line-height:1.09;margin:0 0 27px}h1 span{color:var(--blue)}.intro{max-width:440px;color:var(--muted);font-size:19px;line-height:1.7}.button{display:inline-flex;align-items:center;gap:36px;background:var(--blue);color:#fff;padding:16px 22px;margin-top:18px;font-size:14px;font-weight:600;transition:background .2s}.button:hover{background:#174ec4}.button span{font-size:21px}.hero-note{margin-top:63px;display:flex;gap:26px;font-size:10px;letter-spacing:1px;color:var(--muted)}.hero-brand{background:#fafbfd;display:flex;flex-direction:column;align-items:center;justify-content:center;position:relative;overflow:hidden;border-left:1px solid var(--line);padding:55px 25px}.symbol{width:min(75%,380px);aspect-ratio:300/180;position:relative;overflow:hidden;mix-blend-mode:multiply}.symbol img{position:absolute;width:482.6667%;height:auto;max-width:none;left:-190%;top:-261.1111%}.brand-title{font-size:clamp(25px,3vw,44px);letter-spacing:-1.7px;margin-top:25px}.brand-title strong{font-weight:800}.hero-brand>p{font-size:10px;letter-spacing:2.5px}.brand-bottom{position:absolute;bottom:28px;left:32px;right:32px;border-top:1px solid var(--line);padding-top:18px;display:flex;justify-content:space-between;font-size:10px;letter-spacing:2px}.capabilities{display:flex;justify-content:space-around;gap:20px;flex-wrap:wrap;background:var(--navy);color:#fff;padding:25px 5%;font-size:11px;font-weight:500;letter-spacing:2px}.section{max-width:1440px;margin:auto;padding:100px 5%}.section-head{display:grid;grid-template-columns:1fr 2fr 1.3fr;gap:35px;align-items:start;margin-bottom:56px}.section-head .eyebrow{padding-top:10px}.section-head>p:last-child{color:var(--muted);margin:5px 0}h2{font-size:clamp(32px,3vw,44px);line-height:1.2;letter-spacing:-1.8px;font-weight:500;margin:0}.service-grid{display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}.service-grid article{padding:33px 35px 35px 0;display:flex;flex-direction:column}.service-grid article+article{border-left:1px solid var(--line);padding-left:35px}.index{font-size:13px;color:var(--blue);margin-bottom:35px}h3{font-size:25px;line-height:1.3;letter-spacing:-.6px;font-weight:500;margin:0 0 16px}.service-grid p{color:var(--muted);margin:0 0 28px}.tags{margin-top:auto;font-size:12px;color:var(--blue)}.approach{background:var(--navy);color:#fff;padding:90px max(5%,calc((100vw - 1296px)/2));display:grid;grid-template-columns:1fr 1fr;gap:100px}.approach .eyebrow{color:#8db3ff}.approach>div>p:last-child{max-width:440px;margin-top:27px;color:#c3cdda}.approach ol{padding:0;list-style:none;margin:0}.approach li{display:flex;gap:28px;padding:28px 0;border-top:1px solid #3b4d64}.approach li:first-child{padding-top:0;border:0}.approach li>span{font-size:13px;color:#8db3ff;padding-top:6px}.approach li h3{font-size:22px;margin-bottom:9px}.approach li p{font-size:15px;color:#c3cdda;margin:0}.materials{display:grid;grid-template-columns:1fr 1fr;gap:100px}.material-intro{margin-top:0;color:var(--muted)}.material-row{display:flex;gap:20px;border-bottom:1px solid var(--line);padding:20px 0}.material-row strong{min-width:75px;font-size:19px}.material-row span{color:var(--muted)}.small{font-size:13px;color:var(--muted);margin-top:25px}.project{background:var(--pale);padding:80px max(5%,calc((100vw - 1296px)/2));display:grid;grid-template-columns:1fr 1fr;gap:100px}.project h2{font-size:clamp(40px,4vw,58px)}.project>div>p:last-child{color:var(--muted);max-width:370px}.checklist>div{display:flex;gap:25px;border-bottom:1px solid var(--line);padding:18px 0}.checklist>div:first-child{padding-top:0}.checklist>div>span{color:var(--blue);font-size:12px;padding-top:5px}.checklist p{margin:0;color:var(--muted);font-size:14px}.checklist strong{display:block;color:var(--navy);font-size:16px;margin-bottom:4px}.checklist .contact-note{font-size:13px;margin-top:25px;max-width:none}.site-footer{max-width:1440px;margin:auto;display:flex;gap:25px;align-items:center;justify-content:space-between;padding:35px 5%}.site-footer p,.site-footer>a:last-child{font-size:12px;color:var(--muted)}.skip{position:absolute;top:-100px;left:10px;background:#fff;padding:10px;z-index:10}.skip:focus{top:10px}@media(min-width:1600px){.approach,.project{padding-left:calc((100vw - 1296px)/2);padding-right:calc((100vw - 1296px)/2)}}@media(max-width:900px){.site-header{padding:22px 5%}nav{gap:18px}nav>a:not(.nav-cta){display:none}.hero{min-height:550px}.hero-main{padding-top:58px}h1{letter-spacing:-2px}.hero-note{gap:13px;font-size:9px}.section-head{grid-template-columns:1fr 2fr}.section-head>p:last-child{grid-column:2}.section{padding:65px 5%}.approach,.materials,.project{gap:45px}.service-grid article{padding-right:23px}.service-grid article+article{padding-left:23px}.brand-title{font-size:27px}.hero-brand>p{font-size:8px;letter-spacing:1.5px}.site-footer{flex-wrap:wrap}}@media(max-width:620px){.wordmark{font-size:20px}.wordmark span{font-size:8px}.nav-cta{font-size:12px;padding:10px}.nav-cta span{display:none}.hero{grid-template-columns:1fr}.hero-main{padding:50px 6% 34px}h1{font-size:46px;letter-spacing:-2.5px}.intro{font-size:17px}.hero-note{margin-top:36px;font-size:9px;justify-content:space-between}.hero-brand{min-height:290px;padding:30px 20px 65px;border-left:0;border-top:1px solid var(--line)}.symbol{width:190px}.brand-title{font-size:26px;margin-top:8px}.brand-bottom{bottom:14px;padding-top:10px;font-size:8px}.hero-brand>p{margin-bottom:0}.capabilities{display:grid;grid-template-columns:1fr 1fr;font-size:9px;letter-spacing:1px;padding:20px 6%;gap:14px}.section-head{display:block;margin-bottom:30px}.section-head>p:last-child{margin-top:20px}.section-head .eyebrow{padding:0}.service-grid{grid-template-columns:1fr}.service-grid article,.service-grid article+article{padding:28px 0;border-left:0}.service-grid article+article{border-top:1px solid var(--line)}.index{margin-bottom:16px}h3 br{display:none}.service-grid p{margin-bottom:18px}.approach,.materials,.project{grid-template-columns:1fr;gap:35px;padding:55px 6%}.approach h2,.materials h2{font-size:34px}.approach li{gap:20px}.section{padding:55px 6%}.material-row{font-size:14px}.material-row strong{font-size:17px}.project h2{font-size:44px}.site-footer{padding:30px 6%;gap:14px}.site-footer p{order:3;width:100%;margin:0;font-size:10px}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{transition:none!important}}

/* Shared multi-page navigation and content */
nav{flex-wrap:wrap;gap:22px}nav a[aria-current="page"]{color:var(--blue);text-decoration:underline;text-underline-offset:7px}.page-intro{padding-bottom:55px;border-bottom:1px solid var(--line);background:var(--pale)}.page-intro .intro{max-width:660px;margin-bottom:0}.page-intro h1{font-size:clamp(38px,4.65vw,64px)}.text-link{font-size:16px;color:var(--blue);font-weight:600;margin-top:auto;display:inline-block}.text-link:hover{text-decoration:underline}.scan-section{background:var(--pale)}.scan-section>p:not(.eyebrow){max-width:760px;color:var(--muted)}.compact-cta{display:flex;justify-content:space-between;align-items:center;gap:30px;background:var(--pale)}.compact-cta p{color:var(--muted)}.compact-cta .button{flex-shrink:0;margin:0}.empty-projects>p:not(.eyebrow){color:var(--muted)}.about-content{display:grid;grid-template-columns:1fr 1fr;gap:80px}.about-content p{color:var(--muted)}.about-content>div:last-child>p:first-child{margin-top:0}.wordmark span{font-size:12px;letter-spacing:1px}.tags,.small,.checklist .contact-note,.site-footer p,.site-footer>a:last-child{font-size:14px}.approach li p,.checklist p{font-size:16px}
@media(max-width:1100px){.site-header{align-items:flex-start;flex-direction:column;gap:24px}nav{width:100%;justify-content:flex-start}nav>a:not(.nav-cta){display:block}}
@media(max-width:620px){nav{gap:12px 22px;font-size:14px}.nav-cta{font-size:14px;padding:0;border:0}.wordmark span{font-size:12px}.compact-cta{align-items:flex-start;flex-direction:column}.about-content{grid-template-columns:1fr;gap:22px}.page-intro h1{font-size:40px;letter-spacing:-1.5px}.page-intro{padding-bottom:40px}.material-row{flex-wrap:wrap}.site-footer p{font-size:14px}.hero-note{flex-wrap:wrap}.hero-main h1{font-size:clamp(34px,10vw,46px)}}

.wp-block-group{box-sizing:border-box}.site-main>.wp-block-group{margin-block-start:0}.jr-menu{list-style:none;display:flex;flex-wrap:wrap;gap:22px;padding:0;margin:0}.jr-menu .current-menu-item>a{color:var(--blue)}.editor-styles-wrapper .wp-block{max-width:1440px}

/* Footer links and legal pages */
.site-footer{display:block}.footer-top,.footer-bottom{display:flex;align-items:center;justify-content:space-between;gap:24px;flex-wrap:wrap}.footer-bottom{border-top:1px solid var(--line);margin-top:28px;padding-top:20px}.footer-bottom p{margin:0;font-size:14px}.footer-email{color:var(--blue);font-size:16px}.footer-legal{display:flex;width:auto;gap:12px 24px;font-size:14px}.footer-legal>a{display:inline-block!important}.footer-legal a:hover,.footer-email:hover{text-decoration:underline}.legal-content{max-width:1000px}.legal-content h1{font-size:clamp(32px,5vw,52px);letter-spacing:-1px;overflow-wrap:anywhere}.legal-content h2{font-size:26px;letter-spacing:-.5px;margin:36px 0 16px}.legal-content p{max-width:78ch;overflow-wrap:anywhere}.legal-content a{text-decoration:underline;color:var(--blue)}@media(max-width:620px){.footer-top,.footer-bottom{align-items:flex-start;flex-direction:column}.footer-bottom p{order:initial}.footer-legal{width:100%;gap:12px 20px}}

/* 1.2: Dark technical identity. The brand panel stays light so the existing logo is legible. */
:root{--navy:#0b1828;--muted:#526174;--line:#cbd5df;--pale:#f6f8fa}
body{background:#e9eef3}
.site-header{max-width:none;background:var(--navy);color:#f3f5f7;border-bottom-color:#304157;padding-inline:max(5%,calc((100vw - 1296px)/2))}
.site-header nav a:hover,.site-header nav a[aria-current="page"],.site-header .jr-menu .current-menu-item>a{color:#a9c6ff}
.site-header .nav-cta{border-color:#6681a2}
.hero{border-bottom:1px solid var(--line)}
.hero-main{background:linear-gradient(90deg,rgba(7,17,31,.87) 0%,rgba(7,17,31,.68) 65%,rgba(7,17,31,.25) 100%),url('assets/hero-dark.webp') center center/cover no-repeat;color:#f3f5f7}
.hero-main .eyebrow,.hero-main h1 span{color:#9dc0ff}
.hero-main .intro,.hero-main .hero-note{color:#d8e2ee}
.hero-brand{background:#f6f8fa;color:#0b1828}
.capabilities,.approach{background:#14263b}
.page-intro{background:#172b42;color:#f3f5f7;border-bottom-color:#304157}
.page-intro .eyebrow{color:#a9c6ff}
.page-intro .intro{color:#d8e2ee}
.site-footer{max-width:none;background:#0b1828;color:#f3f5f7;padding-inline:max(5%,calc((100vw - 1296px)/2))}
.site-footer p,.site-footer>a:last-child,.site-footer .footer-bottom p{color:#cbd7e4}
.site-footer .footer-bottom{border-color:#40516a}
.site-footer .footer-email,.site-footer a:hover{color:#a9c6ff}
.site-footer a:focus-visible,.site-header a:focus-visible{outline-color:#a9c6ff}
@media(max-width:620px){.hero-main{background-position:62% center}.site-header,.site-footer{padding-inline:6%}}
/* JR Dimensions – responsive navigation fix */

.site-header > nav {
  background: transparent !important;
  color: #f3f5f7;
  min-width: 0;
}

.site-header .jr-menu {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px 22px;
  margin: 0;
  padding: 0;
  list-style: none;
  background: transparent !important;
}

.site-header .jr-menu li {
  margin: 0;
  padding: 0;
  list-style: none;
}

.site-header .jr-menu a {
  display: block;
  padding: 7px 0;
  color: #f3f5f7;
  font-size: 14px;
  line-height: 1.4;
  text-decoration: none;
}

.site-header .jr-menu a:hover,
.site-header .jr-menu .current-menu-item > a {
  color: #a9c6ff;
}

/* Mobile navigation */

@media (max-width: 620px) {
  .site-header {
    flex-direction: column;
    align-items: stretch;
    gap: 22px;
  }

  .site-header > nav {
    display: block;
    width: 100%;
    background: transparent !important;
  }

  .site-header .jr-menu {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px 16px;
    width: 100%;
  }

  .site-header .jr-menu li {
    min-width: 0;
  }

  .site-header .jr-menu a {
    padding: 10px 0;
    font-size: 14px;
    overflow-wrap: anywhere;
  }
}