/*
Theme Name: Håkan Hjerpe Studio
Template: hakan-hjerpe
Description: Kuvallinen, tumma ja oranssi vaihtoehto. Palvelut muokataan WordPress-artikkeleina.
Version: 2.0.1
Requires at least: 6.4
Requires PHP: 7.4
Text Domain: hakan-hjerpe-studio
*/
:root{--blue:#c46a09;--ink:#202223;--muted:#5d6265;--paper:#f2f1ee;--line:#dddcd8;--orange:#e58b22;--primary:#c46a09;--foreground:#202223;--background:#f2f1ee}body{background:var(--paper);color:var(--ink);font-family:Arial,Helvetica,sans-serif;font-size:16px}.wrap{max-width:1400px;width:calc(100% - 64px)}h1,h2,h3{letter-spacing:-.03em;line-height:1.12}a:hover{color:#a95300}.button,.wp-block-button__link{background:#c66c0c;color:white;border-radius:0;font-size:.8rem;text-transform:uppercase;letter-spacing:.025em;padding:13px 21px;gap:24px}.button:hover,.wp-block-button__link:hover{background:#a45200;color:white}.studio-header{background:#191b1c;color:#fff;border-bottom:1px solid #363839}.studio-header-inner{display:flex;align-items:center;justify-content:space-between;min-height:88px;gap:35px}.studio-brand{font-size:1.5rem;font-weight:800;line-height:1.2;white-space:nowrap;letter-spacing:-.02em}.studio-brand small{display:block;color:#e99b3d;font-size:.75rem;font-weight:500;letter-spacing:0;margin-top:5px}.studio-brand:hover{color:#fff}.studio-nav{display:flex;align-items:center;gap:25px;font-size:.69rem;font-weight:700;text-transform:uppercase}.studio-nav a{position:relative;white-space:nowrap;padding:33px 0}.studio-nav a:hover,.studio-nav a[aria-current=page]{color:#efa245}.studio-nav a[aria-current=page]:after{content:'';position:absolute;bottom:17px;left:0;right:0;height:3px;background:var(--orange)}.studio-header .mobile-nav{position:relative}.studio-header .mobile-nav summary{border-color:#585a5b;color:white}.studio-header .mobile-nav nav{background:#202223;top:52px}.studio-hero{position:relative;background:#1a1d1e;color:#fff;min-height:470px;overflow:hidden;isolation:isolate}.studio-hero .hero-art{position:absolute;z-index:-2;inset:0 0 0 29%;width:71%;height:100%;margin:0}.studio-hero .hero-art img{width:100%;height:100%;object-fit:cover;object-position:center}.studio-hero:after{content:'';position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,#191b1c 0%,#191b1cf5 31%,#191b1cc9 42%,#191b1c20 62%,transparent 100%)}.studio-hero-inner{padding-block:52px;min-height:470px;display:flex;flex-direction:column;justify-content:center;align-items:flex-start}.studio-hero-copy{max-width:550px;width:45%}.studio-hero .eyebrow{color:#d5d6d6;font-size:.65rem;letter-spacing:.16em;margin-bottom:18px}.studio-hero h1{font-size:clamp(2.25rem,3.3vw,3.4rem);font-weight:800;line-height:1.08;letter-spacing:-.035em;margin:0 0 21px}.studio-hero h1 span{color:#ee982f}.studio-hero .intro{font-size:.95rem;color:#e3e4e4;line-height:1.7;margin-bottom:27px;max-width:470px}.studio-hero .wp-block-buttons{display:flex;gap:12px;flex-wrap:wrap;margin:0}.studio-hero .secondary .wp-block-button__link{background:transparent;border:1px solid #bbb;color:#fff}.studio-hero .secondary .wp-block-button__link:hover{background:#ffffff15}.hero-proof{display:flex;gap:25px;margin-top:31px;color:#c7c8c8;font-size:.7rem}.hero-proof span:before{content:'✓';color:var(--orange);margin-right:7px}.studio-body{display:grid;grid-template-columns:minmax(0,1fr) 260px;gap:18px;padding-block:24px 55px}.studio-main{min-width:0}.studio-services{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}.picture-card{min-height:307px;background:#242627;position:relative;isolation:isolate;overflow:hidden;display:flex;flex-direction:column;justify-content:flex-end;color:#fff;padding:23px 18px}.picture-card>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-2;transition:transform .3s}.picture-card:before{content:'';position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,#11111100 0%,#11111155 28%,#141616e8 65%,#111111 100%)}.picture-card:hover{color:white}.picture-card:hover>img{transform:scale(1.04)}.picture-card .service-symbol{height:47px;width:47px;border-radius:50%;background:white;color:#252728;display:grid;place-items:center;margin-bottom:15px;box-shadow:0 0 0 3px #ffffff25}.service-symbol svg{width:29px;height:29px;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}.picture-card h2{font-size:1.08rem;text-transform:uppercase;margin:0 0 12px;letter-spacing:-.025em}.picture-card p{font-size:.79rem;line-height:1.55;color:#f2f2f2;margin:0 0 19px}.picture-card .mini-button{align-self:flex-start;color:white;background:#be6406;padding:8px 14px;min-height:34px;font-size:.66rem;font-weight:700;text-transform:uppercase;letter-spacing:.05em}.studio-sidebar{display:flex;flex-direction:column;gap:13px}.side-box{background:white;padding:24px;border:1px solid #e7e4de}.side-box h2{font-size:.84rem;text-transform:uppercase;letter-spacing:0;line-height:1.3;margin-bottom:12px}.side-box p{font-size:.78rem;color:#5f6264;line-height:1.65}.side-offer{padding:0 21px 23px;text-align:center}.side-offer h2{background:#d87b15;color:white;padding:16px 8px;font-size:1.05rem;margin:0 -21px 19px}.side-offer .button{display:flex;padding:10px 12px;justify-content:center;background:transparent;border:1px solid #c97517;color:#874705;font-size:.64rem;margin-top:18px}.side-call{position:relative;padding-left:45px}.side-call:before{content:'☎';position:absolute;top:22px;left:15px;font-size:1.25rem;color:#cc7414}.side-call .side-number{display:block;color:#b66209;font-weight:800;font-size:1.45rem;letter-spacing:-.04em;line-height:1.25;margin-top:5px;white-space:nowrap}.side-call .number-label{display:block;font-size:.66rem;color:#616466;margin-top:15px}.side-call .number-label:first-of-type{margin-top:0}.side-area .area-mark{color:#cc7414;font-size:1.4rem;line-height:1;margin-bottom:14px}.side-area a{font-size:.7rem;font-weight:700;display:inline-block;margin-top:18px}.studio-strip{background:white;border:1px solid #e6e3dd;margin-top:18px;padding:23px 19px}.strip-heading{display:flex;justify-content:space-between;gap:15px;align-items:center;margin-bottom:19px}.strip-heading h2{font-size:1.15rem;text-transform:uppercase;letter-spacing:-.01em}.strip-heading>span{font-size:.63rem;letter-spacing:.035em;color:#7a6a57}.story-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:13px}.story-card{background:#fff;border:1px solid #ebe7e0}.story-card img{width:100%;height:115px;object-fit:cover}.story-card .story-copy{padding:14px}.story-card h3{font-size:.92rem;line-height:1.3;letter-spacing:-.01em;margin-bottom:9px}.story-card p{font-size:.75rem;line-height:1.6;color:#666;margin-bottom:15px}.story-card .story-link{color:#ae5b08;font-size:.67rem;font-weight:700}.studio-about{display:grid;grid-template-columns:1.2fr 1fr;gap:35px;margin-top:18px;background:#fff;padding:32px;border:1px solid #e6e3dd}.studio-about .eyebrow{color:#a3570b;font-size:.64rem;margin-bottom:12px}.studio-about h2{font-size:1.85rem;margin-bottom:17px}.studio-about p:not(.eyebrow){font-size:.86rem;color:#5e6366;line-height:1.75}.about-facts{display:grid;grid-template-columns:1fr 1fr;gap:2px;background:#e8e5df;align-self:stretch}.about-facts>div{background:#f5f3ef;padding:21px 15px;display:flex;flex-direction:column;justify-content:center}.about-facts strong{font-size:1.6rem;color:#b9660e;line-height:1.2}.about-facts span{font-size:.69rem;margin-top:7px;color:#626467}.studio-stone{display:grid;grid-template-columns:1.2fr 1fr;background:#1c2021;color:white;min-height:420px}.studio-stone>.wp-block-image{margin:0}.studio-stone>.wp-block-image img{width:100%;height:100%;object-fit:cover;max-height:490px}.studio-stone .stone-text{padding:48px 50px;align-self:center}.studio-stone .eyebrow{color:#f0a03e;font-size:.69rem;margin-bottom:17px}.studio-stone h2{font-size:2.8rem;margin-bottom:20px}.studio-stone p:not(.eyebrow){color:#d0d2d2;font-size:.92rem;margin-bottom:25px}.studio-stone .wp-block-buttons{margin:0}.studio-end{display:flex;align-items:center;justify-content:space-between;gap:30px;padding-block:40px}.studio-end h2{font-size:1.8rem}.studio-end p{color:#5f6467;font-size:.86rem;margin-top:8px}.studio-end .button{white-space:nowrap}.site-footer{background:#1a1c1d;color:#fff;padding-top:42px}.footer-grid{padding-bottom:32px;gap:35px}.footer-grid .brand img{width:45px;height:auto}.footer-grid .brand span{font-size:.95rem}.footer-grid>div>a:not(.brand),.footer-grid p{color:#b9bec0;font-size:.78rem}.footer-grid h2{color:#f2f2f2;text-transform:uppercase;font-size:.78rem}.footer-bottom{border-color:#36393a;color:#969fa2;font-size:.65rem}.page-heading{padding-block:35px 40px}.page-heading h1{font-size:clamp(2.5rem,4vw,4rem)}.page-heading .eyebrow{color:#b3620e;font-size:.72rem}.page-heading>p:last-child{font-size:1rem}.breadcrumb{margin-bottom:25px;font-size:.75rem}.article-body{padding:35px;border:1px solid #e6e3dd}.article-body h2{font-size:1.55rem}.article-body p{font-size:.97rem}.article-layout{gap:30px;padding-bottom:45px;grid-template-columns:minmax(0,1fr) 300px}.article-aside{background:#242627;top:25px}.article-aside h2{font-size:1.6rem}.emergency{background:#252829;margin-bottom:40px;padding:30px}.emergency h2{font-size:2.1rem}.emergency-number strong{font-size:1.9rem}.contact-banner{padding-block:20px 50px}.contact-banner h2{font-size:2rem}.contact-banner .eyebrow{font-size:.65rem}.contact-card .contact-phone{color:#b9660e}.contact-card.address{background:#e9e5df}.illustration-note{font-size:.65rem!important;color:#999!important;margin-top:12px!important}
@media(min-width:1600px){.studio-hero-copy{max-width:580px}.studio-hero-inner{min-height:490px}}
@media(max-width:1200px){.studio-nav{gap:16px;font-size:.64rem}.studio-brand{font-size:1.3rem}.studio-header-inner{gap:25px}.studio-body{grid-template-columns:minmax(0,1fr) 230px}.picture-card{padding:19px 13px;min-height:320px}.picture-card h2{font-size:.95rem}.side-box{padding:20px}.side-offer{padding:0 17px 20px}.side-offer h2{margin:0 -17px 18px}.side-call{padding-left:38px}.side-call:before{left:12px}.side-call .side-number{font-size:1.3rem}.story-grid{gap:9px}.story-card .story-copy{padding:11px}.studio-hero-copy{width:49%}.studio-hero .hero-art{inset:0 0 0 28%;width:72%}}
@media(max-width:1020px){.studio-nav{display:none}.studio-header .mobile-nav{display:block}.studio-header-inner{min-height:84px}.studio-services{grid-template-columns:repeat(2,minmax(0,1fr))}.picture-card{min-height:285px;padding:23px}.picture-card h2{font-size:1.2rem}.picture-card p{font-size:.85rem}.studio-body{grid-template-columns:minmax(0,1fr) 230px}.story-grid{grid-template-columns:1fr 1fr;gap:12px}.story-card img{height:150px}.studio-about{grid-template-columns:1fr;gap:22px}.studio-hero-copy{width:55%}.studio-hero h1{font-size:2.65rem}.studio-hero:after{background:linear-gradient(90deg,#191b1cfb 0%,#191b1ce8 33%,#191b1c88 65%,#191b1c20 100%)}.studio-stone .stone-text{padding:35px}.studio-stone h2{font-size:2.2rem}.studio-sidebar .side-box{position:static}.studio-end h2{font-size:1.6rem}.article-layout{grid-template-columns:minmax(0,1fr) 250px}}
@media(max-width:760px){.wrap{width:calc(100% - 28px)}.studio-header-inner{min-height:78px;gap:15px}.studio-brand{font-size:1.12rem;white-space:normal}.studio-brand small{font-size:.59rem}.studio-header .mobile-nav{flex-shrink:0}.studio-header .mobile-nav summary{font-size:.72rem;padding:9px 10px;gap:8px}.studio-hero{min-height:560px}.studio-hero-inner{min-height:560px;padding-block:36px 245px}.studio-hero-copy{width:100%;max-width:520px;padding-inline:8px}.studio-hero h1{font-size:2.3rem;line-height:1.12;max-width:420px}.studio-hero .intro{font-size:.86rem;max-width:420px;margin-bottom:20px}.studio-hero .eyebrow{font-size:.59rem;margin-bottom:15px}.studio-hero .hero-art{inset:auto 0 0;width:100%;height:300px}.studio-hero:after{background:linear-gradient(180deg,#191b1c 0%,#191b1c 45%,#191b1cec 57%,transparent 85%)}.hero-proof{font-size:.62rem;gap:16px;margin-top:20px}.studio-hero .wp-block-button__link{font-size:.67rem;padding:12px 14px}.studio-body{display:flex;flex-direction:column;gap:18px;padding-block:16px 28px}.studio-sidebar{display:grid;grid-template-columns:1fr 1fr;gap:12px}.side-area{grid-column:1/-1}.side-area .area-mark{display:none}.side-area a{margin-top:10px}.side-box h2{font-size:.79rem}.side-call .side-number{font-size:1.28rem}.side-call{padding-left:17px}.side-call:before{display:none}.studio-services{gap:10px}.picture-card{padding:21px 16px;min-height:292px}.picture-card h2{font-size:1.05rem;overflow-wrap:anywhere}.picture-card p{font-size:.8rem}.picture-card .service-symbol{height:41px;width:41px}.story-grid{gap:10px}.studio-strip{padding:19px 13px}.strip-heading{align-items:flex-start}.strip-heading h2{font-size:1rem}.strip-heading>span{display:none}.story-card img{height:125px}.studio-about{padding:25px}.studio-about h2{font-size:1.7rem}.studio-stone{display:flex;flex-direction:column-reverse}.studio-stone .stone-text{padding:30px 25px}.studio-stone>.wp-block-image img{height:300px;object-fit:cover}.studio-end{flex-direction:column;align-items:flex-start;padding-block:30px}.article-layout{grid-template-columns:1fr}.article-body{padding:25px}.article-aside{position:static}.article-aside h2{font-size:1.45rem}.emergency{padding:25px;margin-bottom:30px}.emergency-number strong{font-size:1.65rem}.page-heading>p:last-child{font-size:.95rem}.page-heading h1{font-size:2.5rem}.footer-grid{gap:30px}.contact-banner h2{font-size:1.7rem}.contact-banner{padding-block:10px 35px}.studio-main{width:100%}}
@media(max-width:390px){.studio-brand{font-size:1rem}.studio-brand small{font-size:.55rem}.studio-hero h1{font-size:2.1rem}.picture-card{padding:18px 13px;min-height:305px}.picture-card h2{font-size:.93rem}.picture-card p{font-size:.77rem}.picture-card .mini-button{padding:8px 11px;font-size:.61rem}.side-call .side-number{font-size:1.1rem}.side-offer h2{font-size:.95rem}.studio-sidebar{gap:10px}.side-box{padding:17px}.side-offer{padding-top:0}.hero-proof{gap:12px;font-size:.58rem}}
.about-facts p{display:flex;flex-direction:column}.strip-heading>p{font-size:.7rem;color:#7a6a57;letter-spacing:.03em}.studio-nav{font-size:.78rem}.picture-card p{font-size:.875rem}.picture-card .mini-button{font-size:.75rem}.story-card p{font-size:.875rem}.story-card h3{font-size:1rem}.story-card .story-link{font-size:.75rem}.side-box p{font-size:.875rem}.side-offer .button{font-size:.75rem}.side-call .number-label{font-size:.75rem}.studio-header .mobile-nav nav a{font-size:.875rem}.studio-end .wp-block-buttons{margin:0}.studio-body .studio-sidebar{height:auto}.studio-strip .strip-heading{align-items:baseline}
@media(max-width:1200px){.studio-nav{font-size:.75rem;gap:14px}}
@media(max-width:760px){.picture-card p{font-size:.875rem}.picture-card{min-height:325px}.strip-heading>p{display:none}.studio-sidebar .side-offer{padding-top:0}.studio-sidebar .side-offer h2{margin-top:0}.studio-sidebar .side-call .side-number{font-size:1.25rem}.side-box p{font-size:.8rem}}
@media(max-width:390px){.picture-card p{font-size:.84rem}.picture-card .mini-button{font-size:.69rem}.studio-sidebar .side-call .side-number{font-size:1.12rem}}
@media(prefers-reduced-motion:reduce){.picture-card>img{transition:none}}
@media(max-width:480px){.studio-services,.studio-sidebar,.story-grid{grid-template-columns:1fr}.picture-card{min-height:330px;padding:26px}.picture-card h2{font-size:1.3rem;overflow-wrap:normal}.picture-card p{font-size:.94rem;max-width:300px}.picture-card .mini-button{font-size:.75rem;padding:10px 16px}.picture-card:before{background:linear-gradient(180deg,#11111100 0%,#11111144 20%,#141616e8 66%,#111111 100%)}.story-card img{height:190px}.story-card .story-copy{padding:20px}.studio-sidebar .side-call .side-number{font-size:1.6rem}.side-box{padding:24px}.side-offer{padding:0 21px 24px}.side-offer h2{margin:0 -21px 18px}.side-box p{font-size:.9rem}.side-call .number-label{font-size:.82rem}}