/**
 * Power100 Article Styles — bundled with p100-articles-mu plugin
 *
 * Self-contained — declares own :root tokens because the active theme on legacy
 * (silk-blog) doesn't ship the Power100 design system. Tokens mirror staging's
 * power100-theme :root values verbatim so visual output matches across sites.
 *
 * Source: extracted from staging power100-theme/style.css (.p100-article-*
 * rules + .p100-video-modal* + author byline + responsive media query).
 */

:root {
    --p-red: #FB0401;
    --p-red-deep: #E50504;
    --p-black: #000000;
    --p-white: #FFFFFF;
    --p-gray: #767271;
    --p-lightgray: #F6F2F2;
    --p-border: #E8E4E4;
    --font-display: 'Poppins', sans-serif;
    --font-body: 'Poppins', sans-serif;
}

body.p100-article-page {
    font-family: var(--font-body);
    color: var(--p-black);
    background: var(--p-white);
    margin: 0;
    padding: 0;
}
body.p100-article-page a { color: var(--p-red); text-decoration: none; }
body.p100-article-page a:hover { color: var(--p-red-deep); }
body.p100-article-page .p100-inner { max-width: 1200px; margin: 0 auto; padding: 0 24px; box-sizing: border-box; }

/* ─── Header ─── */
.p100-article-header{background:var(--p-black);padding:16px 0;position:sticky;top:0;z-index:100}
.p100-article-header-inner{display:flex;align-items:center;justify-content:space-between}
.p100-article-logo img{height:36px;width:auto}
.p100-article-nav{display:flex;gap:28px}
.p100-article-nav a{font-family:var(--font-body);font-size:13px;font-weight:600;letter-spacing:.5px;color:rgba(255,255,255,.7);text-decoration:none;text-transform:uppercase;transition:color .2s}
.p100-article-nav a:hover{color:var(--p-white)}

/* ─── Press Release label + subtitle ─── */
.p100-article-label-section{background:var(--p-black);padding:40px 0 30px;border-bottom:3px solid var(--p-red)}
.p100-article-label{font-family:var(--font-display);font-size:12px;font-weight:700;letter-spacing:3px;text-transform:uppercase;color:var(--p-red);margin:0 0 16px}
.p100-article-subtitle{font-family:var(--font-body);font-size:clamp(20px,3vw,28px);font-weight:600;color:var(--p-white);line-height:1.3;margin:0;max-width:800px}

/* ─── Content section ─── */
.p100-article-content-section{background:var(--p-white);padding:48px 0 60px}
.p100-article-inner{max-width:820px}
.p100-article-title{font-family:var(--font-body);font-size:clamp(28px,4vw,42px);font-weight:800;line-height:1.15;color:var(--p-black);margin:0 0 24px}

/* ─── Author byline + company + date ─── */
.p100-article-meta {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    flex-wrap: wrap;
    margin-bottom: 32px;
    padding-bottom: 24px;
    border-bottom: 1px solid var(--p-border);
}
.p100-article-author { display: flex; align-items: center; gap: 12px; }
.p100-article-author-link { display: flex; align-items: center; gap: 12px; text-decoration: none; transition: opacity 0.2s; }
.p100-article-author-link:hover { opacity: 0.85; }
.p100-article-author-photo { width: 44px; height: 44px; border-radius: 50%; object-fit: cover; border: 2px solid var(--p-red); flex-shrink: 0; }
.p100-article-author-badge { width: 44px; height: 44px; border-radius: 50%; background: var(--p-red); color: var(--p-white); display: flex; align-items: center; justify-content: center; font-family: var(--font-display); font-size: 18px; font-weight: 900; flex-shrink: 0; }
.p100-article-author-info { display: flex; flex-direction: column; }
.p100-article-author-name { font-family: var(--font-body); font-size: 15px; font-weight: 700; color: var(--p-black); line-height: 1.2; }
.p100-article-author-role { font-family: var(--font-body); font-size: 12px; color: var(--p-red); font-weight: 600; letter-spacing: 0.3px; }
.p100-article-meta-right { text-align: right; }
.p100-article-company{font-family:var(--font-display);font-size:14px;font-weight:700;color:var(--p-red);letter-spacing:.5px}
.p100-article-date{font-family:var(--font-body);font-size:14px;color:var(--p-gray)}

/* ─── Video player ─── */
.p100-article-video{margin-bottom:40px}
.p100-article-video-player{position:relative;cursor:pointer;overflow:hidden;background:var(--p-black);aspect-ratio:16/9}
.p100-article-video-thumb{width:100%;height:100%;object-fit:cover;display:block;transition:transform .4s,opacity .3s}
.p100-article-video-player:hover .p100-article-video-thumb{transform:scale(1.03);opacity:.8}
.p100-article-play-btn{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:72px;height:72px;background:var(--p-red);border-radius:50%;display:flex;align-items:center;justify-content:center;box-shadow:0 4px 30px rgba(251,4,1,.6);transition:transform .2s;pointer-events:none}
.p100-article-video-player:hover .p100-article-play-btn{transform:translate(-50%,-50%) scale(1.1)}
.p100-article-play-btn svg{margin-left:4px}
.p100-article-video-caption{font-family:var(--font-body);font-size:14px;color:var(--p-gray);margin-top:12px;font-style:italic}

/* ─── Body content ─── */
.p100-article-body{font-family:var(--font-body);font-size:17px;line-height:1.85;color:#222}
.p100-article-body p{margin:0 0 20px}
.p100-article-body h2{font-family:var(--font-body);font-size:26px;font-weight:700;color:var(--p-black);margin:48px 0 16px;line-height:1.2}
.p100-article-body h3{font-family:var(--font-body);font-size:20px;font-weight:700;color:var(--p-black);margin:36px 0 12px}
.p100-article-body strong{color:var(--p-black);font-weight:700}
.p100-article-body ul,.p100-article-body ol{margin:0 0 20px 24px}
.p100-article-body li{margin-bottom:8px}
.p100-article-body blockquote{border-left:4px solid var(--p-red);padding:16px 24px;margin:32px 0;background:#f5f5f5;font-style:italic;color:#333}
.p100-article-body img{max-width:100%;height:auto}

/* ─── Inline figures (between H2 sections) ─── */
.p100-article-figure{margin:40px 0}
.p100-article-figure img{width:100%;display:block}
.p100-article-figcaption{font-family:var(--font-body);font-size:22px;font-weight:400;color:var(--p-black);line-height:1.2;margin-top:20px}

/* ─── WordPress figure / wp-caption ─── */
.p100-article-body figure,
.p100-article-body figure.wp-caption { margin: 36px 0; max-width: 100%; }
.p100-article-body figure img { width: 100%; height: auto; display: block; border-radius: 4px; }
.p100-article-body figcaption,
.p100-article-body .wp-caption-text { font-family: var(--font-body); font-size: 14px; line-height: 1.5; color: var(--p-gray); font-style: italic; text-align: center; margin-top: 12px; }

/* ─── FAQ section ─── */
.p100-article-spacer{height:40px}
.p100-article-faq h2{font-family:var(--font-body);font-size:28px;font-weight:700;color:var(--p-black);margin-bottom:32px}
.p100-faq-item{margin-bottom:28px;padding-bottom:28px;border-bottom:1px solid var(--p-border)}
.p100-faq-item:last-child{border-bottom:none}
.p100-faq-question{font-family:var(--font-body);font-size:18px;font-weight:700;color:var(--p-black);margin:0 0 12px}
.p100-faq-answer{font-family:var(--font-body);font-size:16px;line-height:1.75;color:#444}

/* ─── About Power100 footer block ─── */
.p100-article-about{background:#f5f5f5;padding:48px 0}
.p100-article-about-box{border-left:4px solid var(--p-red);padding-left:28px}
.p100-article-about-box h3{font-family:var(--font-display);font-size:20px;font-weight:700;color:var(--p-black);margin:0 0 12px}
.p100-article-about-box p{font-family:var(--font-body);font-size:15px;line-height:1.7;color:var(--p-gray);margin:0 0 20px}
.p100-article-about-links{display:flex;gap:20px;margin-bottom:16px}
.p100-article-about-links a{font-size:13px;font-weight:600;color:var(--p-red);text-decoration:none}
.p100-article-about-links a:hover{text-decoration:underline}
.p100-article-about-social{display:flex;gap:16px;align-items:center}
.p100-article-about-social span{font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:1px;color:var(--p-gray)}
.p100-article-about-social a{font-size:13px;color:var(--p-black);text-decoration:none}
.p100-article-about-social a:hover{color:var(--p-red)}

/* ─── Video modal ─── */
.p100-video-modal{display:none;position:fixed;inset:0;background:rgba(0,0,0,.92);z-index:99999;align-items:center;justify-content:center;padding:20px}
.p100-video-modal.active{display:flex}
.p100-video-modal-inner{width:100%;max-width:900px;position:relative}
.p100-video-modal-close{position:absolute;top:-40px;right:0;background:none;border:none;color:#fff;font-size:16px;cursor:pointer;font-family:var(--font-display);font-weight:700;letter-spacing:1px;opacity:.7;transition:opacity .2s}
.p100-video-modal-close:hover{opacity:1}
.p100-video-modal-wrap{position:relative;padding-bottom:56.25%;background:#000}
.p100-video-modal-wrap iframe{position:absolute;inset:0;width:100%;height:100%;border:none}

/* ─── Responsive ─── */
@media(max-width:768px){
    .p100-article-header-inner{flex-direction:column;gap:12px}
    .p100-article-nav{gap:16px}
    .p100-article-nav a{font-size:11px}
    .p100-article-label-section{padding:24px 0 20px}
    .p100-article-content-section{padding:32px 0 40px}
    .p100-article-body{font-size:16px}
    .p100-article-figcaption{font-size:18px}
    .p100-article-meta{flex-direction:column;align-items:flex-start;gap:16px}
    .p100-article-meta-right{text-align:left}
    .p100-article-about-links,.p100-article-about-social{flex-wrap:wrap}
}