/*
Theme Name: Plus Blog
Template: twentytwentyfive
Description: Plus Hosting blog, styled like www.plus.hr (colours, Funnel Sans, header and footer links).
Version: 1.6.1
Text Domain: plus-blog
*/

/* Post page */
.plus-single{margin-top:clamp(40px,7vw,88px)}
.plus-single__head .wp-block-post-title{font-size:clamp(2.1rem,1.2rem + 3.2vw,3.1rem);line-height:1.08;letter-spacing:-0.025em;font-weight:750;text-wrap:balance;margin:0}
.plus-meta{margin:20px 0 0;font-size:15.5px;color:var(--wp--preset--color--accent-3)}
.plus-meta a{color:var(--wp--preset--color--contrast);text-decoration:underline;text-decoration-color:var(--wp--preset--color--accent-1);text-underline-offset:3px}
.plus-meta a:hover{color:var(--wp--preset--color--accent-1)}
.plus-single__image{margin-top:40px!important}
.plus-single__content{margin-top:40px!important;font-size:18px;line-height:1.7;color:#3f434c}
.plus-single__content > *{margin-block:0 1.15em}
.plus-single__content :is(h2,h3,h4){margin-block:1.8em .55em;color:var(--wp--preset--color--contrast)}
.plus-single__content h2{font-size:1.55rem;letter-spacing:-0.015em}
.plus-single__content h3{font-size:1.25rem}
.plus-single__content :is(h1,h2,h3,h4) :is(span,b,strong){font-weight:inherit!important}
.plus-single__content [style*="font-family"]{font-family:inherit!important}
.plus-single__content a{text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:3px}
.plus-single__content :is(ul,ol){padding-left:1.3em}
.plus-single__content li{margin-bottom:.4em}
.plus-single__content blockquote{margin-inline:0;padding-left:20px;border-left:3px solid var(--wp--preset--color--accent-1);color:var(--wp--preset--color--contrast)}

/* Tags: only ones with other posts behind them, as plain links with a count */
.plus-tags{margin-top:56px;padding-top:24px;border-top:1px solid var(--wp--preset--color--accent-6);display:flex;gap:8px 20px;align-items:baseline;flex-wrap:wrap}
.plus-tags h2{font-size:15.5px;font-weight:600;margin:0;color:var(--wp--preset--color--accent-3);letter-spacing:0}
.plus-tags ul{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:6px 22px}
.plus-tags a{font-size:16px;font-weight:600;color:var(--wp--preset--color--contrast);text-decoration:none;border-bottom:2px solid var(--wp--preset--color--accent-2);padding-bottom:1px}
.plus-tags a:hover{border-bottom-color:var(--wp--preset--color--accent-1);color:var(--wp--preset--color--accent-1)}
.plus-tags a span{font-weight:400;color:var(--wp--preset--color--accent-3);font-size:14px;margin-left:2px}

/* More on the topic: one lead post next to a short list */
.plus-related-band{background:var(--wp--preset--color--accent-5);margin-top:88px;padding:64px 24px 96px}
body.single-post footer.wp-block-template-part > .wp-block-group{margin-top:0!important}
.plus-related__head{display:flex;justify-content:space-between;align-items:baseline;gap:8px 24px;flex-wrap:wrap;margin-bottom:32px}
.plus-related__head h2{margin:0;font-size:clamp(1.5rem,1.1rem + 1.4vw,2rem);letter-spacing:-0.02em}
.plus-related__head a{font-weight:600;font-size:16px}
.plus-related__grid{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,1fr);grid-template-rows:repeat(2,min-content) 1fr;gap:0 56px}
.plus-related__lead{grid-row:span 3}
.plus-related h3{margin:0;font-size:1.1rem;line-height:1.3;letter-spacing:-0.01em}
.plus-related h3 a{color:var(--wp--preset--color--contrast)}
.plus-related h3 a:hover{color:var(--wp--preset--color--accent-1);text-decoration:none}
.plus-related time{display:block;margin-top:6px;font-size:14px;color:var(--wp--preset--color--accent-3)}
.plus-related img{display:block;width:100%;height:100%;object-fit:cover}
.plus-related__img{display:block;overflow:hidden;background:var(--wp--preset--color--accent-2)}
.plus-related__lead .plus-related__img{aspect-ratio:16/9;border-radius:10px;margin-bottom:20px}
.plus-related__lead h3{font-size:clamp(1.3rem,1rem + 1vw,1.65rem);line-height:1.2;letter-spacing:-0.02em}
.plus-related__lead p{margin:10px 0 0;font-size:16px;line-height:1.55}
.plus-related__item{display:grid;grid-template-columns:132px minmax(0,1fr);gap:18px;align-items:start;padding:20px 0;border-bottom:1px solid var(--wp--preset--color--accent-6)}
.plus-related__item:first-of-type,.plus-related__lead + .plus-related__item{padding-top:0}
.plus-related__item:last-child{border-bottom:0}
.plus-related__item .plus-related__img{aspect-ratio:4/3;border-radius:6px}
.plus-related__item:not(:has(.plus-related__img)){grid-template-columns:1fr}
.plus-related a:focus-visible,.plus-tags a:focus-visible,.plus-meta a:focus-visible{outline:2px solid var(--wp--preset--color--accent-1);outline-offset:3px;border-radius:2px}
@media (max-width:860px){
  .plus-related__grid{grid-template-columns:1fr;grid-template-rows:none}
  .plus-related__lead{grid-row:auto;padding-bottom:28px;margin-bottom:24px;border-bottom:1px solid var(--wp--preset--color--accent-6)}
  .plus-related__lead + .plus-related__item{padding-top:0}
  .plus-related__item{grid-template-columns:96px minmax(0,1fr)}
  .plus-single__content{font-size:17px}
}
.plus-single__content pre{box-sizing:border-box;max-width:100%;min-width:0}
.plus-single__content pre:not(:has(code)){white-space:pre-wrap;font-family:inherit;font-size:16px;background:var(--wp--preset--color--accent-5);padding:14px 18px;border-radius:6px}

/* Home page heading */
.plus-home-title{font-size:clamp(2rem,1.2rem + 2.6vw,2.8rem);line-height:1.1;letter-spacing:-0.025em;font-weight:750;text-wrap:balance;margin:0}
.plus-home-lead{margin-top:12px!important;margin-bottom:0!important;font-size:18px}

/* Glossary terms in posts: first mention, quiet dotted underline, card on hover/focus */
.plus-term{position:relative;display:inline}
.plus-single__content a.plus-term__link{color:inherit;text-decoration:underline dotted;text-decoration-color:var(--wp--preset--color--accent-1);text-decoration-thickness:2px;text-underline-offset:4px}
.plus-single__content a.plus-term__link:hover{color:var(--wp--preset--color--accent-1)}
.plus-term__card{position:absolute;z-index:20;left:0;top:calc(100% + 8px);width:320px;max-width:calc(100vw - 32px);box-sizing:border-box;padding:14px 16px 12px;background:#fff;border:1px solid #d9d2ee;border-radius:8px;box-shadow:0 10px 30px rgba(32,37,50,.14);font-size:15px;line-height:1.5;color:var(--wp--preset--color--accent-3);text-align:left;white-space:normal;visibility:hidden;opacity:0;transition:opacity .12s ease .15s,visibility 0s linear .27s}
.plus-term__card::before{content:"";position:absolute;left:0;right:0;top:-10px;height:10px}
.plus-term:hover .plus-term__card,.plus-term:focus-within .plus-term__card{visibility:visible;opacity:1;transition-delay:.15s,0s}
.plus-term.is-hidden .plus-term__card{visibility:hidden;opacity:0}
.plus-term__title{display:block;margin-bottom:4px;font-weight:700;font-size:16px;color:var(--wp--preset--color--contrast)}
.plus-term__def{display:block}
.plus-single__content a.plus-term__more{display:inline-block;margin-top:8px;font-weight:600;text-decoration:none}
.plus-single__content a.plus-term__more:hover{text-decoration:underline}
@media (hover:none){.plus-term__card{display:none}}
@media (prefers-reduced-motion:reduce){.plus-term__card{transition:none}}

/* Term page */
.plus-glossary-term__crumb{margin:0 0 14px;font-size:15.5px}
.plus-glossary-term h1,.plus-glossary h1{font-size:clamp(2.1rem,1.2rem + 3.2vw,3.1rem);line-height:1.08;letter-spacing:-0.025em;font-weight:750;margin:0}
.plus-glossary-term__lead{margin:20px 0 0;font-size:21px;line-height:1.5;color:var(--wp--preset--color--contrast)}
.plus-glossary-term__body{margin-top:28px;font-size:18px;line-height:1.7;color:#3f434c}
.plus-glossary-term__body p{margin:0 0 1.1em}
.plus-glossary-term__service{margin:28px 0 0;padding:16px 20px;background:var(--wp--preset--color--accent-2);border-radius:8px;font-size:17px}
.plus-glossary-term__service a{font-weight:600}
.plus-glossary-term__posts{margin-top:56px;padding-top:24px;border-top:1px solid var(--wp--preset--color--accent-6)}
.plus-glossary-term__posts h2{font-size:1.35rem;margin:0 0 12px}
.plus-glossary-term__posts ul{list-style:none;margin:0;padding:0}
.plus-glossary-term__posts li{padding:12px 0;border-bottom:1px solid var(--wp--preset--color--accent-6);display:flex;justify-content:space-between;gap:16px;align-items:baseline}
.plus-glossary-term__posts li a{font-weight:600;color:var(--wp--preset--color--contrast)}
.plus-glossary-term__posts time{flex:none;font-size:14px;color:var(--wp--preset--color--accent-3)}
.plus-glossary-term__all{margin-top:28px;font-weight:600}

/* Glossary A-Z */
.plus-glossary__lead{margin:16px 0 0;font-size:19px;max-width:60ch}
.plus-glossary__letters{position:sticky;top:0;z-index:5;margin:32px 0 8px;padding:10px 0;background:rgba(255,255,255,.96);border-bottom:1px solid var(--wp--preset--color--accent-6)}
.plus-glossary__letters ul{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:4px}
.plus-glossary__letters a{display:inline-flex;align-items:center;justify-content:center;min-width:36px;height:36px;border-radius:6px;font-weight:700;color:var(--wp--preset--color--contrast)}
.plus-glossary__letters a:hover{background:var(--wp--preset--color--accent-2);color:var(--wp--preset--color--accent-1);text-decoration:none}
.plus-glossary__group{display:grid;grid-template-columns:64px minmax(0,1fr);gap:0 24px;padding:28px 0;border-bottom:1px solid var(--wp--preset--color--accent-6);scroll-margin-top:72px}
.plus-glossary__group h2{margin:0;font-size:2.2rem;line-height:1;color:var(--wp--preset--color--accent-1)}
.plus-glossary__group dl{margin:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:22px 40px}
.plus-glossary__group dt a{font-weight:700;font-size:18px;color:var(--wp--preset--color--contrast)}
.plus-glossary__group dd{margin:4px 0 0;font-size:15.5px;line-height:1.55}
@media (max-width:600px){.plus-glossary__group{grid-template-columns:1fr}.plus-glossary__group h2{margin-bottom:12px}}
.plus-single__content a.plus-term__link:focus-visible{outline:2px solid var(--wp--preset--color--accent-1);outline-offset:2px;border-radius:2px}

/* Service box at the end of a post (CTA per category) */
.plus-cta{box-sizing:border-box;margin-top:48px;padding:24px 28px;background:var(--wp--preset--color--accent-2);border-radius:10px;display:flex;gap:16px 32px;align-items:center;justify-content:space-between;flex-wrap:wrap}
.plus-cta__text{flex:1 1 320px}
.plus-cta h2{margin:0;font-size:20px;line-height:1.3;letter-spacing:-0.01em;color:var(--wp--preset--color--contrast)}
.plus-cta p{margin:6px 0 0;font-size:16.5px;line-height:1.55;color:var(--wp--preset--color--accent-3)}
.plus-cta__button{box-sizing:border-box;flex:none;text-decoration:none;white-space:nowrap}
.plus-cta__button:focus-visible{outline:2px solid var(--wp--preset--color--accent-1);outline-offset:3px}
.plus-cta + .plus-tags{margin-top:40px}
@media (max-width:520px){.plus-cta{padding:20px}.plus-cta__button{white-space:normal;text-align:center;width:100%}}

/* Category list on the blog home and category pages */
.plus-topics{margin-top:24px!important;margin-bottom:48px!important}
.plus-topics ul{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:10px 26px}
.plus-topics a{font-size:16px;font-weight:600;color:var(--wp--preset--color--contrast);text-decoration:none;border-bottom:2px solid var(--wp--preset--color--accent-2);padding-bottom:1px}
.plus-topics a:hover,.plus-topics a[aria-current]{color:var(--wp--preset--color--accent-1);border-bottom-color:var(--wp--preset--color--accent-1)}
.plus-topics a span{font-weight:400;color:var(--wp--preset--color--accent-3);font-size:14px;margin-left:2px}
.plus-topics a:focus-visible{outline:2px solid var(--wp--preset--color--accent-1);outline-offset:3px;border-radius:2px}
.plus-archive-title{font-size:clamp(2rem,1.2rem + 2.6vw,2.8rem);line-height:1.1;letter-spacing:-0.025em;font-weight:750;margin:0}
.plus-archive-lead{margin-top:12px!important;font-size:18px}
.plus-archive-lead p{margin:0}
.plus-card__cat a{color:var(--wp--preset--color--accent-1);text-decoration:none}
.plus-card__cat a:hover{text-decoration:underline}
/* Hidden glossary cards near the right edge must not widen the page (clip keeps vertical overflow and sticky). */
.plus-single__content{overflow-x:clip}