/* u2pihlis.fi: A bright, image-led personal blog suits the supplied Finnish writing, youth and music content better than a casino-directory aesthetic. The saturated violet dev */
@font-face{font-family:'Georama';font-style:normal;font-display:swap;font-weight:100 900;src:url(../fonts/georama-latin-wght-normal.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'Georama';font-style:normal;font-display:swap;font-weight:100 900;src:url(../fonts/georama-latin-ext-wght-normal.woff2) format('woff2');unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:'Source Sans 3';font-style:normal;font-display:swap;font-weight:200 900;src:url(../fonts/source-sans-3-latin-wght-normal.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'Source Sans 3';font-style:normal;font-display:swap;font-weight:200 900;src:url(../fonts/source-sans-3-latin-ext-wght-normal.woff2) format('woff2');unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C4,U+2113,U+2C60-2C7F,U+A720-A7FF}
:root{--upi-bg:#FFFFFF;--upi-surface:#F3F4F7;--upi-text:#20212A;--upi-muted:#585B68;--upi-primary:#441F80;
 --upi-accent:#0693E3;--upi-dark:#441F80;--upi-border:#e0e0e1;--upi-tint:#f0edf5;--upi-r:0px;--upi-btn-r:0;
 --upi-fh:'Georama',system-ui,-apple-system,'Segoe UI',Roboto,sans-serif;--upi-fb:'Source Sans 3',system-ui,-apple-system,'Segoe UI',Roboto,sans-serif;--upi-hbg:#F3F4F7}
body{background:var(--upi-bg)!important;color:var(--upi-text);font-family:var(--upi-fb)!important;font-size:17px;line-height:1.65}
h1,h2,h3,h4,h5,h6,.wp-block-heading{font-family:var(--upi-fh)!important;color:var(--upi-text);line-height:1.2;letter-spacing:-.01em}
a{color:var(--upi-primary)}a:hover{color:var(--upi-dark)}
input, select, textarea, button, .widget, .site-description, .menu, nav{font-family:var(--upi-fb)}
#masthead.site-header{background:#441F80!important;color:#FFFFFF}
.site-title, .site-title a, .site-description{color:#FFFFFF!important;font-family:var(--upi-fh);font-weight:800}
.primary-navigation a, .primary-navigation .menu-item > a{color:#FFFFFF!important;font-family:var(--upi-fb)}
.primary-navigation a, .primary-navigation .menu-item > a:hover{color:#0693E3!important}
#masthead.site-header{border-bottom:3px solid #441F80}
@media (max-width:991px){#masthead.site-header :is(nav, nav ul, nav > div, nav li){background-color:#441F80!important}}
#colophon.site-footer, .widget-area :is(p, span, div, li, small){color:#ffffff}
html body:not(#_) :is(.side-nav, [class*=offcanvas], [class*=off-canvas], [class*=drawer], [id*=offcanvas], [id*=off-canvas]) a{color:inherit!important}
#masthead.site-header :is(button[class*=toggle], a[class*=toggle], [class*=menu-toggle], .navbar-toggle, [class*=trigger], [class*=hamburger], [class*=burger]){background-color:transparent!important;color:#FFFFFF!important;border-color:#FFFFFF!important}
#masthead.site-header :is(button[class*=toggle], a[class*=toggle], [class*=menu-toggle], .navbar-toggle, [class*=trigger], [class*=hamburger], [class*=burger]) :is(span:empty, .icon-bar){background-color:#FFFFFF!important}#masthead.site-header :is(button[class*=toggle], a[class*=toggle], [class*=menu-toggle], .navbar-toggle, [class*=trigger], [class*=hamburger], [class*=burger]) svg{fill:currentColor;color:#FFFFFF}
#colophon.site-footer, .widget-area{background:var(--upi-dark)!important;color:#ffffff!important}
#colophon.site-footer, .widget-area a{color:#ffffff!important;text-decoration-color:var(--upi-accent)}
.entry-header .entry-title, .page-header .page-title{font-family:var(--upi-fh)!important;color:inherit}
::selection{background:var(--upi-accent);color:#ffffff}
/* converted builder content */
.entry-content > .upi-sec, .page-content-wrap > .upi-sec, .upi-sec{padding:clamp(28px,5vw,64px) clamp(16px,4vw,40px);margin:0 0 4px;border-radius:var(--upi-r)}
.upi-sec:nth-of-type(even){background-color:var(--upi-surface)}
.upi-has-bg{background-size:cover;background-position:center;position:relative;isolation:isolate;padding:clamp(20px,3vw,36px);border-radius:var(--upi-r)}
.upi-has-bg::before{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,.5),rgba(0,0,0,.66));z-index:-1;border-radius:inherit}
.upi-has-bg :is(h1,h2,h3,h4,h5,p,li,span,strong,em,time,blockquote){color:#fff!important}.upi-has-bg a:not(.wp-block-button__link){color:#fff!important;text-decoration:underline}
.upi-has-bg .upi-has-bg::before{opacity:.6}
.upi-has-bg:not(:has(p,h1,h2,h3,h4,h5,li,img,.wp-block-button)){min-height:280px}
.upi-has-bg:not(:has(p,h1,h2,h3,h4,h5,li,img,.wp-block-button))::before{opacity:0}
.upi-has-bg:not(:has(p,h1,h2,h3,h4,h5,li,img,.wp-block-button)) .wp-block-separator{display:none}
.upi-sec--dark{background-color:var(--upi-dark)!important;color:#ffffff}.upi-sec--dark :is(h1,h2,h3,h4,p,li,a){color:#ffffff!important}
.upi-sec-1, .upi-hero{background:linear-gradient(90deg,var(--upi-tint) 0 62%,var(--upi-primary) 62%)}
.upi-sec-1 > .wp-block-heading:first-child, .upi-sec-1 > * > .wp-block-heading:first-child, .upi-hero h1{font-size:clamp(30px,4.6vw,52px)}
.upi-blurb{border-top:2px solid var(--upi-text);padding-top:18px}
.upi-blurb .wp-block-image img{border-radius:calc(var(--upi-r) / 1.5)}
.upi-cta{background:var(--upi-primary);color:#ffffff;border-radius:var(--upi-r);padding:clamp(24px,4vw,44px)}
.upi-cta :is(h1,h2,h3,h4,h5,p,a,li,strong,span){color:#ffffff!important}.upi-cta p a{text-decoration:underline}
.upi-cta .wp-block-button__link{background:var(--upi-accent)!important;color:#ffffff!important}
.upi-counter{display:inline-block;vertical-align:top;margin:6px 32px 12px 0;min-width:120px}.upi-counter strong{display:block;font-family:var(--upi-fh);font-size:2.4em;line-height:1;color:var(--upi-primary)}
.upi-sec--dark .upi-counter strong, .upi-sec-1 .upi-counter strong{color:var(--upi-accent)}
.wp-block-button__link, .wp-element-button{background:var(--upi-primary);color:#ffffff;border-radius:var(--upi-btn-r);padding:.7em 1.5em;font-family:var(--upi-fb);font-weight:700;text-decoration:none;}
.wp-block-button__link:hover{filter:brightness(1.08);color:#ffffff}
.wp-block-details{border:1px solid var(--upi-border);border-radius:calc(var(--upi-r) / 1.5);padding:14px 18px;margin:0 0 10px;background:var(--upi-surface)}
.wp-block-details summary{font-family:var(--upi-fh);font-weight:700;cursor:pointer}
.wp-block-details[open] summary{margin-bottom:10px;color:var(--upi-primary)}
.wp-block-quote{border-left:4px solid var(--upi-accent);padding-left:18px}
.wp-block-separator{border-color:var(--upi-border);opacity:1}
.wp-block-latest-posts.is-grid li{background:var(--upi-surface);border:1px solid var(--upi-border);border-radius:var(--upi-r);padding:14px}
.wp-block-latest-posts__post-title{font-family:var(--upi-fh);font-weight:700}
.wp-block-latest-posts__featured-image img{border-radius:calc(var(--upi-r) / 1.5);width:100%;height:auto;aspect-ratio:16/10;object-fit:cover}
.wp-block-latest-posts.wp-block-latest-posts__list:has(.wp-block-latest-posts__featured-image){display:grid;grid-template-columns:repeat(auto-fill,minmax(min(210px,100%),1fr));gap:18px;padding:0;margin:0 0 24px;list-style:none}
.wp-block-latest-posts__list:has(.wp-block-latest-posts__featured-image) > li{margin:0}
.wp-block-latest-posts__featured-image{margin:0 0 8px}
.wp-block-columns{gap:clamp(16px,3vw,32px)}
.wp-block-column .wp-block-heading{font-size:clamp(20px,2vw,26px);overflow-wrap:break-word;hyphens:auto}
.wp-block-column h1.wp-block-heading{font-size:clamp(24px,2.6vw,34px)}
.wp-block-columns:has(> .wp-block-column:nth-child(4)) .wp-block-heading{font-size:clamp(16px,1.35vw,20px);hyphens:manual}
@media (max-width:781px){.upi-sec{border-radius:0}}

/* v2: homepage + converted pages own the full width */
body{overflow-x:clip}
/* every parent wrapper around the composed page: one full-width column, no reserved sidebar track */
:is(.upi-home, .upi-built) :has(> .upi-main), :is(.upi-home, .upi-built) :has(> * > .upi-main), :is(.upi-home, .upi-built) :has(> * > * > .upi-main){width:auto!important;max-width:none!important;flex:1 1 100%!important;float:none!important;grid-column:1 / -1!important;border-left:0!important;border-right:0!important;padding-left:0!important;padding-right:0!important;margin-left:0!important;margin-right:0!important;display:block!important;box-shadow:none!important;background-image:none!important}
:is(.upi-home, .upi-built) :is(#secondary, .sidebar, #sidebar, .widget-area, aside.sidebar, [id^=sidebar]):not(footer *, #colophon *, .site-footer *, [class*=footer] *, [class*=footer]){display:none!important}
.upi-main{width:100%;max-width:none;margin:0;padding:0;float:none}
.upi-wrap{max-width:1180px;margin:0 auto;padding:0 clamp(16px,3vw,28px);box-sizing:border-box}
.upi-narrow{max-width:760px}
.upi-main--home:has(.upi-sec--latest) .upi-sec--content .wp-block-latest-posts{display:none}   /* the builder's own post list repeats the latest-posts section */
.upi-home :is(.custom-header-media, .wp-custom-header){display:none}
.upi-main--built .upi-content{padding-top:clamp(20px,3vw,40px);padding-bottom:clamp(28px,4vw,56px)}
.upi-content > *{max-width:100%}
.upi-sec--content .upi-content{padding:0 clamp(16px,3vw,28px)}
.upi-sec{padding:clamp(36px,5vw,72px) 0;margin:0;border-radius:0}
.upi-main--home > .upi-sec:nth-of-type(even){background:var(--upi-surface)}
.upi-h{font-family:var(--upi-fh);font-size:clamp(24px,2.6vw,34px);font-weight:800;margin:0 0 6px;color:var(--upi-text)}
.upi-sec-head{display:flex;flex-wrap:wrap;align-items:baseline;gap:6px 18px;margin:0 0 22px;border-bottom:3px solid var(--upi-primary);padding-bottom:10px}
.upi-sec-head .upi-h{margin:0;flex:1 1 auto}.upi-dek{flex-basis:100%;order:3;margin:0;color:var(--upi-muted)}
.upi-more{font-weight:700;text-decoration:none;color:var(--upi-primary)!important;white-space:nowrap}
.upi-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(14px,2vw,24px)}
.upi-card{background:var(--upi-surface);border:1px solid var(--upi-border);border-radius:var(--upi-r);overflow:hidden;display:flex;flex-direction:column;transition:transform .2s,box-shadow .2s}
.upi-main--home > .upi-sec:nth-of-type(even) .upi-card{background:var(--upi-bg)}
.upi-card:hover{transform:translateY(-3px);box-shadow:0 14px 30px rgba(0,0,0,0.1)}
.upi-card-img{display:block;aspect-ratio:16/10;overflow:hidden;background:var(--upi-dark)}
.upi-card-img img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .4s}.upi-card:hover .upi-card-img img{transform:scale(1.04)}
.upi-card-body{padding:16px 18px 18px;display:flex;flex-direction:column;gap:8px;flex:1}
.upi-card-title{font-family:var(--upi-fh);font-size:clamp(17px,1.35vw,20px);line-height:1.3;margin:0;font-weight:700}
.upi-card-title a{color:var(--upi-text)!important;text-decoration:none}.upi-card-title a:hover{color:var(--upi-primary)!important}
.upi-card time{font-size:13px;color:var(--upi-muted);margin-top:auto}
.upi-card-ex{margin:0;color:var(--upi-muted);font-size:15.5px}
.upi-card--noimg{border-top:4px solid var(--upi-primary)}.upi-card--noimg .upi-card-body{padding:22px 22px 20px}.upi-card--noimg .upi-card-title{font-size:clamp(19px,1.6vw,23px)}
/* homepage builder text: left-aligned, a readable measure */
.upi-sec--content :is(p, ul, ol, blockquote, h2, h3, h4):not(.wp-block-column *, .upi-card *, .wp-block-buttons *){max-width:720px;margin-left:auto;margin-right:auto;text-align:left!important}
.upi-foot, .upi-foot :is(p, a, li){font-family:var(--upi-fb)!important}
.upi-chip{align-self:flex-start;background:var(--upi-primary);color:#ffffff!important;font-size:12px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;padding:3px 9px;border-radius:999px;text-decoration:none}
/* opener: featured */
.upi-open{padding:clamp(22px,3.5vw,44px) 0}
.upi-feat{display:grid;grid-template-columns:1.35fr 1fr;gap:clamp(14px,2vw,24px)}
.upi-card--big .upi-card-img{aspect-ratio:16/9}.upi-card--big .upi-card-title{font-size:clamp(22px,2.4vw,32px)}
.upi-feat-list{display:grid;grid-template-rows:repeat(4,1fr);gap:12px}
.upi-card--row{flex-direction:row;align-items:stretch}.upi-card--row .upi-card-img{flex:0 0 38%;aspect-ratio:auto}
.upi-card--row .upi-card-body{padding:10px 14px}.upi-card--row .upi-card-title{font-size:16px}
/* opener: hero */
.upi-open--hero{position:relative;isolation:isolate;background:var(--upi-dark) center/cover no-repeat;color:#fff;padding:clamp(64px,10vw,140px) 0 clamp(40px,6vw,72px)}
.upi-open--hero::before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(100deg,rgba(8,10,14,.82) 0%,rgba(8,10,14,.6) 48%,rgba(8,10,14,.28) 100%)}
.upi-kicker{display:inline-block;color:#ffffff;background:var(--upi-accent);font-weight:800;letter-spacing:.08em;text-transform:uppercase;font-size:13px;padding:4px 10px;border-radius:4px;margin:0 0 14px}
.upi-hero-title{font-family:var(--upi-fh);color:#fff!important;font-size:clamp(32px,5.2vw,64px);line-height:1.05;max-width:16ch;margin:0 0 16px}
.upi-hero-text{color:rgba(255,255,255,.88);font-size:clamp(17px,1.5vw,20px);max-width:58ch;margin:0 0 22px}
.upi-btns{display:flex;flex-wrap:wrap;gap:12px}
.upi-btn{display:inline-block;background:var(--upi-primary);color:#ffffff!important;font-weight:800;padding:.85em 1.6em;border-radius:var(--upi-btn-r);text-decoration:none}
.upi-btn:hover{filter:brightness(1.1)}.upi-btn--ghost{background:transparent;color:#fff!important;box-shadow:inset 0 0 0 2px rgba(255,255,255,.8)}
.upi-hero-post{display:block;margin-top:clamp(28px,4vw,48px);max-width:560px;color:#fff!important;text-decoration:none;font-weight:700;font-size:17px;border-left:4px solid var(--upi-accent);padding:6px 0 6px 14px}
.upi-hero-post span{display:block;font-size:12px;letter-spacing:.1em;text-transform:uppercase;color:var(--upi-accent);margin-bottom:2px}
/* opener: split (text beside the newest image, no overlay) */
.upi-open--split{padding:clamp(24px,4vw,48px) 0}.upi-split{display:grid;grid-template-columns:45fr 55fr;gap:32px;align-items:center;background:var(--upi-surface);border-left:4px solid var(--upi-primary);border-radius:var(--upi-r);padding:clamp(18px,3vw,36px)}
.upi-split .upi-hero-title{color:var(--upi-text)!important;font-size:clamp(28px,3.6vw,46px)}.upi-split .upi-hero-title a{color:inherit!important;text-decoration:none}
.upi-split-img{display:block;min-width:0}.upi-split-img img{width:100%;aspect-ratio:4/3;object-fit:cover;border-radius:calc(var(--upi-r) / 1.5);display:block}
.upi-split .upi-kicker{margin-bottom:10px}.upi-split .upi-hero-text{color:var(--upi-muted)}
@media (max-width:760px){.upi-split{grid-template-columns:1fr}}
/* key pages */
.upi-tiles{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:14px;margin-top:18px}
.upi-tile{display:flex;justify-content:space-between;align-items:center;gap:12px;background:var(--upi-primary);color:#ffffff!important;padding:22px 22px;border-radius:var(--upi-r);font-family:var(--upi-fh);font-weight:800;font-size:18px;text-decoration:none}
.upi-tile:nth-child(even){background:var(--upi-dark);color:#ffffff!important}.upi-tile b{font-size:22px;transition:transform .2s}.upi-tile:hover b{transform:translateX(4px)}
/* related posts on single posts */
.upi-related{margin:48px 0 0;padding-top:22px;border-top:3px solid var(--upi-primary)}.upi-related .upi-h{font-size:22px;margin-bottom:16px}
.upi-related .upi-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.upi-related .upi-card-title{font-size:16px}
/* footer columns */
.upi-foot{background:#441F80;color:#FFFFFF;padding:clamp(36px,5vw,64px) 0 0;text-align:left;width:100%}
.upi-foot-grid{display:grid;grid-template-columns:1.4fr repeat(3,1fr);gap:28px}
.upi-foot-name{font-family:var(--upi-fh);font-weight:800;font-size:22px;margin:0 0 10px;color:#FFFFFF!important}
.upi-foot p{color:#dad2e6!important;font-size:15px;line-height:1.6}
.upi-foot-h{font-family:var(--upi-fh);font-weight:800;text-transform:uppercase;letter-spacing:.08em;font-size:13px!important;color:#0693E3!important;margin:0 0 12px}
.upi-foot ul{list-style:none;margin:0;padding:0}.upi-foot li{margin:0 0 8px;padding:0;border:0;background:none}
.upi-foot a{color:#FFFFFF!important;text-decoration:none;font-size:15px}.upi-foot a:hover{text-decoration:underline}
.upi-foot-bottom{border-top:1px solid #664797;margin-top:32px;padding:18px clamp(16px,3vw,28px);font-size:14px;color:#d0c7df}
/* header: the current menu item never white-on-white */
#masthead.site-header :is(.current-menu-item, .current_page_item, .current-menu-ancestor) > a{background:transparent!important;color:var(--upi-accent)!important;box-shadow:inset 0 -3px 0 var(--upi-accent)}
/* "Uncategorized" labels stay out of sight */
a[href*="/category/uncategorized/"], a[href*="/category/yleinen/"], a[href*="/category/ukategorisert/"], a[href*="/kategoria/yleinen/"]{display:none!important}
/* front page: the parent's page-title bars and empty page heroes */
.upi-home :is(.page-header, .page-title-bar, .page-titlebar, .entry-hero, .page-hero-section, #page-title, .titlebar, .breadcrumbs, .breadcrumb-trail, .page-header-wrap, .ast-archive-description){display:none!important}
/* single posts: readable measure, headings that never break mid-word */
.single-post :is(.entry-content, .post-content){max-width:760px}
:is(h1, .entry-title){overflow-wrap:normal;word-break:normal;hyphens:manual}
h1.entry-title, .single .entry-title, .page .entry-title{font-size:clamp(28px,4.2vw,46px)!important;line-height:1.12}
@media (max-width:900px){.upi-feat{grid-template-columns:1fr}.upi-grid, .upi-related .upi-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.upi-foot-grid{grid-template-columns:1fr 1fr}}
@media (max-width:600px){.upi-grid, .upi-related .upi-grid{grid-template-columns:1fr}.upi-foot-grid{grid-template-columns:1fr}.upi-card--row .upi-card-img{flex-basis:34%}
 h1.entry-title, .single .entry-title, .page .entry-title{font-size:clamp(26px,7.4vw,34px)!important}.upi-hero-title{font-size:clamp(30px,8.6vw,40px)}}

.upi-has-bg:has(:is(p, h1, h2, h3, h4, h5, li, .wp-block-button)){background-image:none!important;background-color:var(--upi-surface)!important;border:1px solid var(--upi-border)}
.upi-has-bg:has(:is(p, h1, h2, h3, h4, h5, li, .wp-block-button))::before{display:none}
.upi-has-bg:has(:is(p, h1, h2, h3, h4, h5, li, .wp-block-button)) :is(h1, h2, h3, h4, h5, p, li, span, strong, em, time, blockquote){color:var(--upi-text)!important}
.upi-has-bg:has(:is(p, h1, h2, h3, h4, h5, li, .wp-block-button)) a:not(.wp-block-button__link){color:var(--upi-primary)!important}

.entry-content a:not(.wp-block-button__link), .upi-content a:not(.wp-block-button__link){color:#441F80}

.single-post :is(#secondary, .sidebar, #sidebar, .widget-area, aside.sidebar, [id^=sidebar]):not(footer *, [class*=footer] *, [class*=footer]){display:none!important}
.single-post :is(#primary, .content-area, .site-main, main#main){width:auto!important;max-width:820px!important;float:none!important;flex:1 1 100%!important;margin-left:auto!important;margin-right:auto!important}

/* parent: twentytwentyone */

:root{--global--color-background:var(--upi-bg);--global--color-primary:var(--upi-text);--global--color-secondary:var(--upi-muted);
 --global--font-primary:var(--upi-fh);--global--font-secondary:var(--upi-fb);--button--color-background:var(--upi-primary);
 --button--color-text-hover:var(--upi-primary);--global--color-border:var(--upi-border);--wp--style--color--link:var(--upi-primary)}
#masthead.site-header{max-width:none;padding:20px max(24px,calc((100vw - 1140px)/2));margin:0}
.home .entry-header{display:none}
.site-footer{max-width:none;padding:32px max(24px,calc((100vw - 1140px)/2))}
html:root{--responsive--aligndefault-width:min(calc(100vw - 2 * var(--global--spacing-horizontal)), 1040px)!important;--responsive--alignwide-width:min(calc(100vw - 2 * var(--global--spacing-horizontal)), 1240px)!important}
.site-footer :is(.site-name, .site-name a, .powered-by, .powered-by a, .privacy-policy, .privacy-policy a), .widget-area :is(h2, a, li, p){color:inherit!important}

