/* =========================================================
   DAILY SARHAD — SHARED PUBLIC THEME
   Used across all public-facing pages.
   Page-specific layout CSS lives in each page's own <style>.
========================================================= */

:root{
    --green:#087443;
    --green-dark:#032f25;
    --green-deep:#011c18;

    --gold:#d8b45a;
    --gold-light:#ffe5a0;

    --white:#ffffff;
    --offwhite:#f5f8f6;

    --text:#14201c;
    --muted:#6b7772;

    --red:#d71920;

    --border:rgba(20,50,40,.12);

    --shadow:0 20px 60px rgba(0,0,0,.10);

    --radius:22px;
}

/* =========================================================
   RESET / BASE
========================================================= */

*{ box-sizing:border-box; }

html{ scroll-behavior:smooth; }

body{
    margin:0;
    background:linear-gradient(180deg,#f4f8f5 0%,#ffffff 35%,#f4f7f5 100%);
    color:var(--text);
    font-family:Inter,Arial,Helvetica,sans-serif;
    overflow-x:hidden;
}

a{ color:inherit; }
img{ max-width:100%; }

/* =========================================================
   TOP NAV
========================================================= */

.top-navbar{
    position:sticky;
    top:0;
    z-index:999;
    background:rgba(2,35,28,.94);
    backdrop-filter:blur(16px);
    border-bottom:1px solid rgba(255,255,255,.08);
    box-shadow:0 8px 30px rgba(0,0,0,.15);
}

.nav-container{
    max-width:1400px;
    margin:auto;
    min-height:68px;
    padding:0 24px;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:30px;
    position:relative;
}

.nav-logo{ flex-shrink:0; }

.nav-logo a{
    text-decoration:none;
    color:#fff;
    font-size:20px;
    font-weight:900;
    letter-spacing:1.5px;
}

.nav-logo a::before{
    content:"";
    display:inline-block;
    width:8px;
    height:8px;
    background:var(--gold);
    border-radius:50%;
    margin-right:8px;
    box-shadow:0 0 15px var(--gold);
}

.nav-menu{
    list-style:none;
    display:flex;
    align-items:center;
    gap:4px;
    margin:0;
    padding:0;
}

.nav-menu li{ position:relative; }

.nav-menu a,
.dropdown-toggle{
    border:0;
    background:none;
    color:#e9f1ee;
    text-decoration:none;
    padding:10px 13px;
    border-radius:10px;
    font-size:14px;
    font-weight:600;
    cursor:pointer;
    display:block;
    font-family:inherit;
}

.nav-menu a:hover,
.dropdown-toggle:hover,
.nav-menu .active{
    color:#fff;
    background:rgba(216,180,90,.14);
}

.latest-news-btn{
    background:linear-gradient(135deg,#e31b23,#a90000) !important;
    color:#fff !important;
    box-shadow:0 0 0 1px rgba(255,255,255,.08),0 5px 20px rgba(220,0,0,.25);
    animation:livePulse 2s infinite;
}

@keyframes livePulse{
    0%,100%{ box-shadow:0 0 0 0 rgba(220,0,0,.25); }
    50%{ box-shadow:0 0 0 7px rgba(220,0,0,0); }
}

.submenu{
    position:absolute;
    top:100%;
    left:0;
    min-width:220px;
    background:#062e26;
    border:1px solid rgba(255,255,255,.08);
    border-radius:14px;
    padding:8px;
    list-style:none;
    display:none;
    box-shadow:0 20px 50px rgba(0,0,0,.3);
}

.dropdown:hover .submenu{ display:block; }
.submenu a{ padding:11px 13px; }
.submenu a:hover{ background:rgba(216,180,90,.14); }

.nav-toggle{
    display:none;
    border:0;
    background:none;
    color:white;
    font-size:24px;
    cursor:pointer;
    padding:8px;
}

/* =========================================================
   PAGE HEADER (brand banner used on inner pages)
========================================================= */

.page-header{
    position:relative;
    overflow:hidden;
    background:
        radial-gradient(circle at 15% 30%,rgba(216,180,90,.20),transparent 30%),
        radial-gradient(circle at 85% 20%,rgba(33,180,116,.18),transparent 30%),
        linear-gradient(135deg,#032f25,#07583e 50%,#011c18);
    color:#fff;
    padding:50px 24px;
}

.page-header::before{
    content:"";
    position:absolute;
    width:600px;
    height:600px;
    right:-220px;
    top:-350px;
    border-radius:50%;
    border:1px solid rgba(255,220,120,.2);
    box-shadow:0 0 80px rgba(216,180,90,.12);
}

.page-header-inner{
    position:relative;
    max-width:1400px;
    margin:auto;
}

.page-eyebrow{
    color:var(--gold-light);
    font-size:12px;
    text-transform:uppercase;
    letter-spacing:2px;
    font-weight:900;
}

.page-header h1{
    margin:12px 0 0;
    font-size:clamp(32px,5vw,54px);
    line-height:1.05;
    letter-spacing:-2px;
    font-weight:950;
    background:linear-gradient(90deg,#fff,#fff5c8,#d8b45a);
    -webkit-background-clip:text;
    background-clip:text;
    color:transparent;
}

.page-header p{
    margin:14px 0 0;
    color:rgba(255,255,255,.75);
    font-size:16px;
    max-width:650px;
    line-height:1.7;
}

.breadcrumbs{
    margin-top:18px;
    font-size:13px;
    color:rgba(255,255,255,.6);
}

.breadcrumbs a{
    color:rgba(255,255,255,.85);
    text-decoration:none;
    font-weight:700;
}

.breadcrumbs a:hover{ color:var(--gold-light); }

/* =========================================================
   BREAKING TICKER
========================================================= */

.breaking{
    max-width:1400px;
    margin:-25px auto 0;
    position:relative;
    z-index:10;
    padding:0 20px;
    width:100%;
    overflow:hidden;
}

.breaking-inner{
    display:flex;
    align-items:center;
    overflow:hidden;
    width:100%;
    background:linear-gradient(90deg,#b60000,#df1e25);
    color:#fff;
    border-radius:14px;
    box-shadow:0 12px 35px rgba(120,0,0,.2);
}

.breaking-label{
    flex-shrink:0;
    padding:14px 20px;
    font-size:12px;
    font-weight:900;
    letter-spacing:1px;
    background:rgba(0,0,0,.18);
    white-space:nowrap;
}

.breaking-track-wrap{ overflow:hidden; flex:1; min-width:0; }

.breaking-track{
    display:flex;
    width:max-content;
    animation:ticker 35s linear infinite;
    will-change:transform;
}

.breaking-track:hover{ animation-play-state:paused; }

.breaking-track a{
    color:#fff;
    text-decoration:none;
    font-size:14px;
    font-weight:600;
    padding:14px 50px 14px 0;
    white-space:nowrap;
    flex-shrink:0;
}

@keyframes ticker{
    from{ transform:translateX(0); }
    to{ transform:translateX(-50%); }
}

/* =========================================================
   SHARED LAYOUT / SECTION HEADING
========================================================= */

.main{
    max-width:1400px;
    margin:45px auto 0;
    padding:0 20px;
}

.section-heading{
    display:flex;
    align-items:end;
    justify-content:space-between;
    gap:15px;
    margin-bottom:20px;
    border-bottom:1px solid #dce6e1;
    padding-bottom:13px;
}

.section-heading h2{
    margin:0;
    font-size:clamp(25px,3vw,34px);
    color:var(--green-dark);
    letter-spacing:-1px;
}

.section-heading h2 span{ color:var(--gold); }

.section-heading a{
    color:var(--green);
    font-weight:800;
    text-decoration:none;
    font-size:14px;
    white-space:nowrap;
}

/* =========================================================
   CARDS: NEWS / SIDE STORY / HERO
========================================================= */

.category-badge{
    display:inline-block;
    background:var(--gold);
    color:#14261e;
    padding:7px 12px;
    border-radius:20px;
    font-size:11px;
    font-weight:900;
    text-transform:uppercase;
    letter-spacing:1px;
    margin-bottom:12px;
}

.news-meta{
    color:#8a9690;
    font-size:11px;
    font-weight:700;
    text-transform:uppercase;
}

.side-story{
    display:grid;
    grid-template-columns:145px 1fr;
    gap:15px;
    background:#fff;
    border:1px solid var(--border);
    border-radius:18px;
    overflow:hidden;
    min-height:135px;
    transition:transform .25s ease,box-shadow .25s ease;
}

.side-story:hover{ transform:translateY(-3px); box-shadow:0 15px 35px rgba(0,0,0,.08); }
.side-story img{ width:145px; height:100%; min-height:135px; object-fit:cover; }
.side-story-content{ padding:14px 14px 14px 0; min-width:0; }
.side-story h3{ margin:8px 0; font-size:17px; line-height:1.3; }
.side-story h3 a{ text-decoration:none; }
.side-story h3 a:hover{ color:var(--green); }

.news-card{
    background:#fff;
    border:1px solid var(--border);
    border-radius:18px;
    overflow:hidden;
    min-width:0;
    transition:transform .25s ease,box-shadow .25s ease;
}

.news-card:hover{ transform:translateY(-6px); box-shadow:0 18px 45px rgba(0,0,0,.09); }

.news-card-image{
    height:205px;
    overflow:hidden;
    background:linear-gradient(135deg,#e7eee9,#d4e2da);
}

.news-card-image img{ width:100%; height:100%; object-fit:cover; transition:transform .5s ease; }
.news-card:hover img{ transform:scale(1.06); }

.news-card-body{ padding:18px; }
.news-card h3{ margin:8px 0 10px; font-size:18px; line-height:1.4; }
.news-card h3 a{ text-decoration:none; }
.news-card h3 a:hover{ color:var(--green); }
.news-card p{ margin:0; color:var(--muted); font-size:13px; line-height:1.6; }

.read-more{
    display:inline-flex;
    margin-top:15px;
    color:var(--green);
    font-weight:800;
    text-decoration:none;
    font-size:12px;
}

.latest-grid{
    display:grid;
    grid-template-columns:repeat(4,1fr);
    gap:20px;
}

/* =========================================================
   BUTTONS
========================================================= */

.gold-btn,
.outline-btn{
    display:inline-flex;
    align-items:center;
    gap:8px;
    padding:13px 19px;
    border-radius:12px;
    text-decoration:none;
    font-weight:900;
    font-size:13px;
    border:0;
    cursor:pointer;
    font-family:inherit;
}

.gold-btn{
    color:#10261c;
    background:linear-gradient(135deg,#ffe39a,#cda447);
}

.outline-btn{
    color:#fff;
    border:1px solid rgba(255,255,255,.25);
    background:rgba(255,255,255,.05);
}

.green-btn{
    display:inline-flex;
    align-items:center;
    gap:8px;
    padding:13px 19px;
    border-radius:12px;
    text-decoration:none;
    font-weight:900;
    font-size:13px;
    background:var(--green);
    color:#fff;
    border:0;
    cursor:pointer;
    font-family:inherit;
}

/* =========================================================
   GENERIC CONTENT CARD (used for forms / static content)
========================================================= */

.content-card{
    background:#fff;
    border:1px solid var(--border);
    border-radius:var(--radius);
    box-shadow:0 12px 40px rgba(0,0,0,.05);
    padding:32px;
}

/* =========================================================
   FOOTER
========================================================= */

.site-footer{
    margin-top:80px;
    background:linear-gradient(135deg,#011c18,#04392d);
    color:#fff;
    padding:60px 20px 0;
}

.footer-inner{
    max-width:1400px;
    margin:auto;
    display:grid;
    grid-template-columns:1.5fr 1fr 1fr 1.2fr;
    gap:40px;
}

.footer-brand h3{ font-size:26px; margin:0 0 15px; }
.footer-brand p{ color:rgba(255,255,255,.65); line-height:1.8; font-size:13px; }

.footer-social{ display:flex; gap:10px; margin-top:18px; }

.footer-social a{
    width:36px;
    height:36px;
    display:grid;
    place-items:center;
    border-radius:10px;
    background:rgba(255,255,255,.08);
    color:#fff;
    text-decoration:none;
}

.footer-social a:hover{ background:var(--gold); color:#14261e; }

.footer-col h4{
    color:var(--gold-light);
    margin:0 0 17px;
    font-size:14px;
    text-transform:uppercase;
    letter-spacing:1px;
}

.footer-col a{
    display:block;
    color:rgba(255,255,255,.65);
    text-decoration:none;
    font-size:13px;
    margin-bottom:11px;
}

.footer-col a:hover{ color:#fff; }

.footer-contact{ color:rgba(255,255,255,.65); font-size:13px; line-height:1.8; }
.footer-contact strong{ color:#fff; }
.footer-contact a{ color:rgba(255,255,255,.65); text-decoration:none; }
.footer-contact a:hover{ color:#fff; }

.footer-bottom{
    max-width:1400px;
    margin:45px auto 0;
    padding:20px 0;
    border-top:1px solid rgba(255,255,255,.1);
    display:flex;
    justify-content:space-between;
    align-items:center;
    flex-wrap:wrap;
    gap:12px 20px;
    color:rgba(255,255,255,.45);
    font-size:12px;
}

.footer-legal-links{ display:flex; flex-wrap:wrap; gap:6px 12px; }
.footer-legal-links a{ color:rgba(255,255,255,.55); text-decoration:none; }
.footer-legal-links a:hover{ color:#fff; }
.footer-legal-links span{ color:rgba(255,255,255,.25); }

/* =========================================================
   TABLET
========================================================= */

@media(max-width:1150px){
    .nav-menu{ gap:0; }
    .nav-menu a,.dropdown-toggle{ padding:9px 8px; font-size:12px; }
    .latest-grid{ grid-template-columns:repeat(3,1fr); }
    .footer-inner{ grid-template-columns:repeat(2,1fr); }
}

@media(max-width:850px){
    .nav-toggle{ display:block; }

    .nav-menu{
        display:none;
        position:absolute;
        top:68px;
        left:0;
        right:0;
        background:#032f25;
        flex-direction:column;
        align-items:stretch;
        padding:10px 15px 15px;
        max-height:calc(100vh - 68px);
        overflow-y:auto;
        overflow-x:hidden;
        box-shadow:0 15px 30px rgba(0,0,0,.25);
    }

    .nav-menu.active{ display:flex; }
    .nav-menu a,.dropdown-toggle{ width:100%; padding:13px; }

    .submenu{
        position:static;
        width:100%;
        box-shadow:none;
        border:0;
        background:rgba(0,0,0,.15);
        display:none;
    }

    .dropdown:hover .submenu{ display:none; }
    .dropdown.open .submenu{ display:block; }

    .latest-grid{ grid-template-columns:repeat(2,1fr); }
}

@media(max-width:600px){
    .nav-container{ padding:0 15px; }
    .nav-logo a{ font-size:16px; }
    .page-header{ padding:35px 18px; }
    .breaking{ margin-top:-18px; padding:0 8px; }
    .breaking-label{ padding:12px 13px; font-size:10px; }
    .breaking-track a{ font-size:12px; padding-right:35px; }
    .latest-grid{ grid-template-columns:1fr; }
    .footer-inner{ grid-template-columns:1fr; }
    .footer-bottom{ flex-direction:column; align-items:flex-start; }
    .content-card{ padding:22px; }
}

/* =========================================================
   INNER-PAGE COMPONENTS
   (shared by about / contact / services / jobs / PR pages…)
========================================================= */

/* ---- section wrapper helpers ---- */

.section-block{ margin-top:60px; }
.section-block:first-child{ margin-top:0; }

.text-center{ text-align:center; }

.eyebrow-tag{
    display:block;
    color:var(--gold);
    text-transform:uppercase;
    letter-spacing:2px;
    font-weight:800;
    font-size:12px;
    margin-bottom:10px;
}

.block-title{
    margin:0 0 16px;
    font-size:clamp(24px,3vw,34px);
    color:var(--green-dark);
    letter-spacing:-1px;
}

.block-lede{
    max-width:900px;
    margin:0 auto;
    color:var(--muted);
    font-size:15px;
    line-height:1.85;
}

.block-lede p + p{ margin-top:14px; }

/* ---- feature / value grid ---- */

.feature-grid{
    display:grid;
    grid-template-columns:repeat(auto-fit,minmax(260px,1fr));
    gap:22px;
}

.feature-card{
    background:#fff;
    border:1px solid var(--border);
    border-top:4px solid var(--green);
    border-radius:18px;
    padding:30px;
    box-shadow:0 10px 30px rgba(0,0,0,.05);
    transition:box-shadow .25s ease,transform .25s ease;
}

.feature-card:hover{ transform:translateY(-4px); box-shadow:0 16px 40px rgba(0,0,0,.09); }

.feature-card i.feature-icon{
    font-size:26px;
    color:var(--green);
    margin-bottom:14px;
    display:inline-block;
}

.feature-card h3{ margin:0 0 10px; font-size:19px; color:var(--green-dark); }
.feature-card p{ margin:0; color:var(--muted); font-size:13px; line-height:1.7; }
.feature-card ul{ margin:12px 0 0; padding-left:18px; color:var(--muted); font-size:13px; line-height:1.8; }

.feature-card.highlight-card{ border-top-color:var(--gold); background:linear-gradient(180deg,#fffdf7,#ffffff); }

.feature-card .service-icon{
    width:52px; height:52px;
    display:grid;
    place-items:center;
    border-radius:14px;
    background:rgba(8,116,67,.10);
    color:var(--green);
    font-size:22px;
    margin-bottom:16px;
}

.feature-card.highlight-card .service-icon{ background:rgba(216,180,90,.18); color:#8a6c1f; }

.feature-card .service-features{ list-style:none; padding:0; margin:14px 0 20px; }
.feature-card .service-features li{
    font-size:12px;
    color:var(--muted);
    padding:6px 0 6px 22px;
    position:relative;
}
.feature-card .service-features li::before{
    content:"\f00c";
    font-family:"Font Awesome 6 Free";
    font-weight:900;
    color:var(--green);
    position:absolute;
    left:0;
    font-size:10px;
}

/* ---- profile / founder / team cards ---- */

.profile-grid{
    display:grid;
    grid-template-columns:repeat(auto-fit,minmax(280px,1fr));
    gap:26px;
}

.profile-card{
    background:#fff;
    border:1px solid var(--border);
    border-radius:20px;
    overflow:hidden;
    text-align:center;
    box-shadow:0 12px 35px rgba(0,0,0,.06);
    transition:transform .3s ease;
}

.profile-card:hover{ transform:translateY(-6px); }

.profile-photo{ width:100%; height:300px; overflow:hidden; background:#e7eee9; }
.profile-photo img{ width:100%; height:100%; object-fit:cover; object-position:top; transition:transform .5s ease; }
.profile-card:hover .profile-photo img{ transform:scale(1.05); }

.profile-info{ padding:26px; }
.profile-name{ margin:0 0 5px; font-size:19px; color:var(--green-dark); }
.profile-role{
    display:block;
    color:var(--gold);
    font-weight:800;
    text-transform:uppercase;
    font-size:11px;
    letter-spacing:.5px;
    margin-bottom:14px;
}
.profile-bio{ color:var(--muted); font-size:13px; line-height:1.7; margin:0; }

/* ---- CTA / showcase panel ---- */

.showcase-panel{
    position:relative;
    overflow:hidden;
    border-radius:28px;
    padding:50px;
    color:#fff;
    background:
        radial-gradient(circle at 15% 20%,rgba(216,180,90,.20),transparent 28%),
        radial-gradient(circle at 90% 70%,rgba(35,190,125,.14),transparent 30%),
        linear-gradient(135deg,#021f19,#07573d,#021c17);
    box-shadow:0 30px 80px rgba(0,0,0,.16);
    display:flex;
    align-items:center;
    gap:45px;
    flex-wrap:wrap;
}

.showcase-copy{ flex:1 1 380px; }
.showcase-copy h2{ margin:0 0 15px; font-size:clamp(26px,3.4vw,38px); letter-spacing:-1px; }
.showcase-copy p{ color:rgba(255,255,255,.75); line-height:1.75; margin:0 0 12px; }

.showcase-media{ flex:0 1 260px; text-align:center; }
.showcase-media img{
    max-width:220px;
    background:#fff;
    padding:18px;
    border-radius:50%;
    filter:drop-shadow(0 15px 30px rgba(0,0,0,.3));
}

/* ---- forms ---- */

.form-card{
    background:#fff;
    border:1px solid var(--border);
    border-radius:var(--radius);
    box-shadow:0 12px 40px rgba(0,0,0,.05);
    padding:34px;
}

.form-grid{ display:grid; grid-template-columns:1fr 1fr; gap:18px; }
.form-grid .full{ grid-column:1 / -1; }

.form-group{ display:flex; flex-direction:column; gap:7px; margin-bottom:18px; }
.form-group label{ font-size:13px; font-weight:800; color:var(--green-dark); }

.form-group input,
.form-group select,
.form-group textarea{
    padding:12px 14px;
    border:1px solid var(--border);
    border-radius:10px;
    font-family:inherit;
    font-size:14px;
    background:var(--offwhite);
    color:var(--text);
}

.form-group input:focus,
.form-group select:focus,
.form-group textarea:focus{
    outline:none;
    border-color:var(--green);
    background:#fff;
}

.form-group textarea{ resize:vertical; min-height:120px; }

.form-note{ font-size:12px; color:var(--muted); margin-top:-8px; margin-bottom:14px; }

/* ---- alerts ---- */

.alert{
    padding:14px 18px;
    border-radius:12px;
    font-size:14px;
    margin-bottom:20px;
    display:flex;
    align-items:flex-start;
    gap:10px;
}

.alert-success{ background:#e6f6ee; color:#0a6b3f; border:1px solid #bce8d0; }
.alert-error{ background:#fdecec; color:#a4161a; border:1px solid #f5c2c2; }
.alert-info{ background:#eaf3f0; color:var(--green-dark); border:1px solid var(--border); }

/* ---- simple info card list (contact info, addresses) ---- */

.info-list{ display:flex; flex-direction:column; gap:18px; }

.info-item{ display:flex; gap:14px; align-items:flex-start; }

.info-item .info-icon{
    width:42px; height:42px;
    flex-shrink:0;
    display:grid;
    place-items:center;
    border-radius:12px;
    background:rgba(8,116,67,.10);
    color:var(--green);
    font-size:17px;
}

.info-item h4{ margin:0 0 4px; font-size:14px; color:var(--green-dark); }
.info-item p,
.info-item a{ margin:0; font-size:13px; color:var(--muted); line-height:1.6; text-decoration:none; }
.info-item a:hover{ color:var(--green); }

/* ---- tabs ---- */

.tab-bar{ display:flex; gap:8px; flex-wrap:wrap; margin-bottom:24px; }

.tab-btn{
    padding:10px 18px;
    border-radius:10px;
    border:1px solid var(--border);
    background:#fff;
    color:var(--green-dark);
    font-weight:700;
    font-size:13px;
    cursor:pointer;
    font-family:inherit;
}

.tab-btn.active{ background:var(--green); color:#fff; border-color:var(--green); }

/* ---- pills / badges / tags ---- */

.pill{
    display:inline-flex;
    align-items:center;
    gap:6px;
    padding:5px 12px;
    border-radius:20px;
    background:rgba(8,116,67,.10);
    color:var(--green);
    font-size:11px;
    font-weight:800;
    text-transform:uppercase;
    letter-spacing:.5px;
}

.pill-gold{ background:rgba(216,180,90,.18); color:#8a6c1f; }
.pill-red{ background:rgba(215,25,32,.10); color:var(--red); }

/* ---- generic listing / job / project cards ---- */

.listing-grid{
    display:grid;
    grid-template-columns:repeat(auto-fit,minmax(300px,1fr));
    gap:20px;
}

.listing-card{
    background:#fff;
    border:1px solid var(--border);
    border-radius:18px;
    padding:24px;
    transition:transform .25s ease,box-shadow .25s ease;
}

.listing-card:hover{ transform:translateY(-4px); box-shadow:0 16px 40px rgba(0,0,0,.08); }

.listing-card-top{ display:flex; justify-content:space-between; align-items:flex-start; gap:10px; margin-bottom:10px; }
.listing-card h3{ margin:0 0 6px; font-size:17px; color:var(--green-dark); }
.listing-card .listing-meta{ font-size:12px; color:var(--muted); display:flex; flex-wrap:wrap; gap:12px; margin:10px 0; }
.listing-card .listing-meta span{ display:inline-flex; align-items:center; gap:5px; }
.listing-card p{ font-size:13px; color:var(--muted); line-height:1.6; margin:0 0 14px; }

/* ---- news listing layout (news.php home, category.php) ---- */
.news-listing-layout{
    display:grid;
    grid-template-columns:220px minmax(0,1fr) 300px;
    gap:24px;
    align-items:start;
}
@media(max-width:1000px){
    .news-listing-layout{ grid-template-columns:1fr; }
    .news-listing-layout > aside{ order:2; }
    .news-listing-layout > div{ order:1; }
}

.news-grid-3col{ grid-template-columns:repeat(3,1fr); }
@media(max-width:850px){
    .news-grid-3col{ grid-template-columns:repeat(2,1fr); }
}
@media(max-width:600px){
    .news-grid-3col{ grid-template-columns:1fr; }
}

.news-grid-3col{ grid-template-columns:repeat(3,1fr); }
@media(max-width:850px){
    .news-grid-3col{ grid-template-columns:repeat(2,1fr); }
}
@media(max-width:600px){
    .news-grid-3col{ grid-template-columns:1fr; }
}

.news-hero-card{ margin-bottom:20px; }
.news-hero-card-link{
    text-decoration:none;
    color:inherit;
    display:grid;
    grid-template-columns:1.2fr 1fr;
    gap:0;
    align-items:stretch;
}
.news-hero-card-image{ height:auto; min-height:260px; }
.news-hero-card-body{ display:flex; flex-direction:column; justify-content:center; }
@media(max-width:700px){
    .news-hero-card-link{ grid-template-columns:1fr; }
    .news-hero-card-image{ min-height:200px; }
    .news-hero-card-body{ padding:16px 18px; }
}

/* ---- article detail page ---- */

.article-layout{ display:grid; grid-template-columns:1fr 340px; gap:36px; align-items:start; }

.breadcrumb-trail{ font-size:12px; color:var(--muted); margin-bottom:16px; }
.breadcrumb-trail a{ color:var(--green); text-decoration:none; font-weight:700; }
.breadcrumb-trail a:hover{ text-decoration:underline; }

.article-title{
    margin:0 0 14px;
    font-size:clamp(26px,3.6vw,42px);
    line-height:1.2;
    color:var(--green-dark);
    letter-spacing:-1px;
    font-weight:900;
}

.article-summary{
    font-size:16px;
    color:var(--muted);
    line-height:1.7;
    padding:16px 18px;
    background:var(--offwhite);
    border-left:3px solid var(--green);
    border-radius:8px;
    margin-bottom:18px;
}

.article-byline{
    display:flex;
    flex-wrap:wrap;
    gap:10px;
    align-items:center;
    font-size:12px;
    color:var(--muted);
    margin-bottom:20px;
}

.article-byline strong{ color:var(--green-dark); }

.article-hero-image{
    width:100%;
    height:380px;
    object-fit:cover;
    border-radius:20px;
    margin-bottom:26px;
    cursor:zoom-in;
    box-shadow:0 20px 50px rgba(0,0,0,.1);
}

@media(max-width:850px){
    .article-hero-image{ height:280px; }
}

@media(max-width:600px){
    .article-hero-image{ height:220px; border-radius:14px; }
}
.article-prose{ font-size:16px; line-height:1.9; color:var(--text); }
.article-prose p{ margin:0 0 20px; }
.article-prose h2,
.article-prose h3{ color:var(--green-dark); margin:30px 0 14px; }
.article-prose img{ border-radius:14px; margin:16px 0; cursor:zoom-in; }
.article-prose a{ color:var(--green); }
.article-prose blockquote{
    border-left:3px solid var(--gold);
    background:var(--offwhite);
    padding:14px 18px;
    border-radius:8px;
    margin:20px 0;
    color:var(--muted);
    font-style:italic;
}
.article-prose ul,
.article-prose ol{ padding-left:22px; margin:0 0 20px; }

.share-buttons{ display:flex; gap:10px; flex-wrap:wrap; margin:34px 0; }
.share-buttons a{
    display:inline-flex;
    align-items:center;
    gap:8px;
    padding:10px 16px;
    border-radius:10px;
    text-decoration:none;
    font-weight:800;
    font-size:13px;
    color:#fff;
}
.share-buttons a.share-whatsapp{ background:#25d366; }
.share-buttons a.share-facebook{ background:#1877f2; }

.related-news-box{ background:#fff; border:1px solid var(--border); border-radius:18px; padding:22px; margin-top:20px; }
.related-news-box h3{ margin:0 0 14px; font-size:16px; color:var(--green-dark); }
.related-news-box ul{ list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:12px; }
.related-news-box a{ font-size:13px; text-decoration:none; color:var(--text); line-height:1.5; }
.related-news-box a:hover{ color:var(--green); }

.sidebar-box{ background:#fff; border:1px solid var(--border); border-radius:18px; padding:22px; margin-bottom:20px; }
.sidebar-box h3{ margin:0 0 14px; font-size:16px; color:var(--green-dark); }
.sidebar-item{ padding:10px 0; border-bottom:1px solid var(--border); }
.sidebar-item:last-child{ border-bottom:0; }
.sidebar-item a{ font-size:13px; text-decoration:none; color:var(--text); line-height:1.5; }
.sidebar-item a:hover{ color:var(--green); }

/* ---- thumbnail list item (related news, sidebar latest/breaking) ---- */
.thumb-list-item{
    display:flex;
    align-items:flex-start;
    gap:12px;
    text-decoration:none;
    color:inherit;
}
.thumb-list-item .thumb-list-image{
    flex-shrink:0;
    width:64px;
    height:64px;
    border-radius:10px;
    overflow:hidden;
    background:var(--offwhite);
}
.thumb-list-image img{ width:100%; height:100%; object-fit:cover; display:block; }
.thumb-list-image .thumb-list-placeholder{
    width:100%; height:100%; display:grid; place-items:center; color:#a9baB2; font-size:16px;
}
.thumb-list-item .thumb-list-body{ min-width:0; }
.thumb-list-item .thumb-list-title{
    font-size:13px;
    font-weight:700;
    line-height:1.4;
    color:var(--text);
    display:-webkit-box;
    -webkit-line-clamp:3;
    -webkit-box-orient:vertical;
    overflow:hidden;
}
.thumb-list-item:hover .thumb-list-title{ color:var(--green); }
.thumb-list-item .thumb-list-meta{ font-size:10px; color:var(--muted); margin-top:4px; text-transform:uppercase; font-weight:700; letter-spacing:.4px; }

.lightbox{
    display:none;
    position:fixed; inset:0;
    background:rgba(0,0,0,.9);
    z-index:9999;
    align-items:center;
    justify-content:center;
    cursor:zoom-out;
}
.lightbox.active{ display:flex; }
.lightbox img{ max-width:92%; max-height:92%; border-radius:8px; }

.news-list-lede{ max-width:800px; color:var(--muted); font-size:14px; line-height:1.75; margin:10px 0 0; }

@media(max-width:1000px){
    .article-layout{ grid-template-columns:1fr; }
}

/* ---- portfolio page ---- */

.portfolio-grid{ display:grid; grid-template-columns:repeat(auto-fit,minmax(300px,1fr)); gap:22px; }

.portfolio-card{
    background:#fff; border:1px solid var(--border); border-radius:20px; overflow:hidden;
    opacity:0; transform:translateY(24px); transition:opacity .5s ease,transform .5s ease,box-shadow .25s ease;
}
.portfolio-card.show{ opacity:1; transform:translateY(0); }
.portfolio-card:hover{ box-shadow:0 18px 45px rgba(0,0,0,.1); }

.portfolio-img{ position:relative; height:190px; overflow:hidden; background:var(--offwhite); }
.portfolio-img img{ width:100%; height:100%; object-fit:cover; }
.portfolio-img .overlay{
    position:absolute; inset:0; background:rgba(1,20,16,.75); display:flex; align-items:center; justify-content:center;
    gap:12px; opacity:0; transition:opacity .3s ease;
}
.portfolio-img:hover .overlay{ opacity:1; }
.portfolio-img .overlay a{
    padding:9px 16px; border-radius:8px; text-decoration:none; font-weight:800; font-size:12px;
}
.portfolio-img .overlay a.preview{ background:rgba(255,255,255,.15); color:#fff; border:1px solid rgba(255,255,255,.3); }
.portfolio-img .overlay a:not(.preview){ background:var(--gold); color:#14261e; }

.portfolio-content{ padding:20px; }
.portfolio-content h3{ margin:0 0 8px; color:var(--green-dark); font-size:17px; }
.portfolio-content p{ margin:0 0 12px; color:var(--muted); font-size:13px; line-height:1.6; }

.filters{ display:flex; gap:10px; justify-content:center; flex-wrap:wrap; margin-bottom:30px; }
.filters button{
    padding:10px 20px; border-radius:30px; border:1px solid var(--border); background:#fff;
    color:var(--green-dark); font-weight:800; font-size:13px; cursor:pointer; font-family:inherit;
}
.filters button.active{ background:var(--green); color:#fff; border-color:var(--green); }

.preview-modal{ display:none; position:fixed; inset:0; z-index:2000; background:rgba(1,20,16,.75); align-items:center; justify-content:center; padding:20px; }
.preview-modal .preview-modal-content{ background:#fff; border-radius:18px; padding:30px; max-width:420px; width:100%; position:relative; }
.preview-modal .close-btn{ position:absolute; top:14px; right:18px; font-size:24px; cursor:pointer; color:var(--muted); }
.preview-modal h2{ color:var(--green-dark); margin:0 0 10px; }
.preview-modal p{ color:var(--muted); margin:0; line-height:1.6; }

.stat-counter-strip{
    display:grid; grid-template-columns:repeat(4,1fr); gap:20px; text-align:center;
    background:linear-gradient(135deg,#032f25,#07583e); border-radius:24px; padding:36px 24px; color:#fff;
}
.stat-counter-strip .stat-number{ font-size:32px; font-weight:900; color:var(--gold-light); }
.stat-counter-strip .stat-caption{ font-size:12px; color:rgba(255,255,255,.75); margin-top:6px; }

@media(max-width:700px){
    .stat-counter-strip{ grid-template-columns:1fr 1fr; }
}

/* ---- stats strip ---- */

.stats-strip{
    display:grid;
    grid-template-columns:repeat(4,1fr);
    gap:20px;
    background:linear-gradient(135deg,#032f25,#07583e);
    border-radius:24px;
    padding:36px 24px;
    color:#fff;
    text-align:center;
}

.stats-strip .stat-number{ font-size:30px; font-weight:900; color:var(--gold-light); }
.stats-strip .stat-label{ font-size:12px; color:rgba(255,255,255,.75); margin-top:6px; }

/* ---- instagram project card ---- */

.ig-project-card{
    background:#fff;
    border:1px solid var(--border);
    border-radius:18px;
    overflow:hidden;
    box-shadow:0 10px 30px rgba(0,0,0,.05);
}

.ig-embed-wrap{ background:var(--offwhite); min-height:200px; }
.ig-project-info{ padding:22px; }
.ig-project-info h3{ margin:0 0 8px; font-size:17px; color:var(--green-dark); }
.ig-project-info p{ margin:0 0 14px; font-size:13px; color:var(--muted); line-height:1.6; }
.ig-project-meta{ display:flex; flex-wrap:wrap; gap:8px; margin-bottom:16px; }

.view-instagram-btn{
    display:inline-flex; align-items:center; gap:8px;
    background:linear-gradient(135deg,#f58529,#dd2a7b,#8134af);
    color:#fff; padding:10px 16px; border-radius:10px; text-decoration:none;
    font-weight:800; font-size:13px;
}

@media(max-width:700px){
    .stats-strip{ grid-template-columns:repeat(2,1fr); }
}

/* ---- influencer directory page ---- */

.directory-hero{
    position:relative; overflow:hidden; text-align:center; padding:60px 24px;
    color:#fff;
    background:
        radial-gradient(circle at 15% 30%,rgba(216,180,90,.20),transparent 30%),
        radial-gradient(circle at 85% 20%,rgba(33,180,116,.18),transparent 30%),
        linear-gradient(135deg,#032f25,#07583e 50%,#011c18);
}
.directory-hero h1{ margin:0 0 14px; font-size:clamp(28px,4vw,42px); letter-spacing:-1px; }
.directory-hero p{ max-width:650px; margin:0 auto; color:rgba(255,255,255,.75); line-height:1.7; }
.directory-hero .hero-btn{
    display:inline-flex; margin-top:22px; padding:13px 22px; border-radius:12px;
    background:linear-gradient(135deg,#ffe39a,#cda447); color:#14261e; text-decoration:none; font-weight:900; font-size:13px;
}

.filter-box{ background:#fff; border:1px solid var(--border); border-radius:20px; padding:26px; box-shadow:0 10px 30px rgba(0,0,0,.05); }
.filter-box h2{ margin:0 0 6px; font-size:20px; color:var(--green-dark); }
.filter-box > p{ margin:0 0 20px; color:var(--muted); font-size:13px; }

.filter-grid{ display:grid; grid-template-columns:repeat(auto-fit,minmax(200px,1fr)); gap:16px; }
.filter-item label{ display:block; font-size:12px; font-weight:800; color:var(--green-dark); margin-bottom:6px; }
.filter-item input,
.filter-item select{
    width:100%; padding:11px 14px; border-radius:10px; border:1px solid var(--border);
    background:var(--offwhite); font-family:inherit; font-size:13px; color:var(--text);
}
.filter-item input:focus,
.filter-item select:focus{ outline:none; border-color:var(--green); background:#fff; }

.view-controls{ display:flex; gap:10px; justify-content:flex-end; margin:20px 0; }
.view-btn{
    padding:9px 16px; border-radius:10px; border:1px solid var(--border); background:#fff;
    color:var(--green-dark); font-weight:800; font-size:12px; cursor:pointer; font-family:inherit;
}
.view-btn.active{ background:var(--green); color:#fff; border-color:var(--green); }

.influencers-container{ display:grid; grid-template-columns:repeat(3,1fr); gap:20px; opacity:0; transition:opacity .3s ease; }
.influencers-container.show{ opacity:1; }
.influencers-container.list-view{ grid-template-columns:1fr; }

.influencers-container .influencer-card{
    background:#fff; border:1px solid var(--border); border-radius:16px; overflow:hidden; position:relative;
    text-align:left; transition:transform .25s ease,box-shadow .25s ease;
}
.influencers-container .influencer-card:hover{ transform:translateY(-4px); box-shadow:0 14px 35px rgba(0,0,0,.08); }
.influencers-container.list-view .influencer-card{ display:flex; align-items:center; }
.influencers-container .influencer-card img{ width:100%; height:180px; object-fit:cover; display:block; }
.influencers-container.list-view .influencer-card img{ width:110px; height:110px; flex-shrink:0; }
.influencers-container .influencer-card .badge-top{
    position:absolute; top:10px; right:10px; background:linear-gradient(135deg,#ffe39a,#cda447);
    color:#14261e; font-size:10px; font-weight:900; padding:4px 9px; border-radius:20px;
}
.influencers-container .influencer-card strong{ color:var(--green-dark); font-size:15px; }
.influencers-container .influencer-card a{ color:var(--green) !important; font-weight:800; font-size:12px; }

.pagination{ display:flex; gap:8px; justify-content:center; flex-wrap:wrap; margin-top:30px; }
.pagination button,
.pagination a{
    width:36px; height:36px; border-radius:8px; border:1px solid var(--border); background:#fff;
    color:var(--green-dark); font-weight:700; cursor:pointer; font-family:inherit;
    display:inline-flex; align-items:center; justify-content:center; text-decoration:none; font-size:13px;
}
.pagination button:hover,
.pagination a:hover{ border-color:var(--green); color:var(--green); }
.pagination button.active,
.pagination a.active{ background:var(--green); color:#fff; border-color:var(--green); }
.pagination a.disabled{ opacity:.4; pointer-events:none; }
.pagination .pagination-arrow{ width:auto; padding:0 12px; gap:6px; }

.seo-content{ background:#fff; border:1px solid var(--border); border-radius:20px; padding:30px; }
.seo-content h2{ color:var(--green-dark); font-size:20px; margin:0 0 12px; }
.seo-content h3{ color:var(--green-dark); font-size:15px; margin:22px 0 8px; }
.seo-content p{ color:var(--muted); font-size:13px; line-height:1.75; margin:0 0 12px; }

@media(max-width:1000px){
    .influencers-container{ grid-template-columns:repeat(2,1fr); }
}
@media(max-width:650px){
    .influencers-container{ grid-template-columns:1fr; }
    .view-controls{ justify-content:center; }
}

/* ---- founder profile / biography page ---- */

.founder-profile{
    display:grid;
    grid-template-columns:280px 1fr;
    gap:34px;
    align-items:center;
    background:#fff;
    border:1px solid var(--border);
    border-radius:24px;
    padding:34px;
    box-shadow:0 12px 40px rgba(0,0,0,.06);
}

.founder-profile .founder-img img{
    width:100%;
    border-radius:20px;
    object-fit:cover;
    aspect-ratio:1/1;
}

.founder-profile .founder-info h2{ margin:8px 0 14px; font-size:26px; color:var(--green-dark); }
.founder-profile .founder-info p{ color:var(--muted); font-size:14px; line-height:1.8; margin:0 0 12px; }

.bio-section{ margin-top:40px; }
.bio-section h3{ color:var(--green-dark); font-size:20px; margin:0 0 16px; padding-bottom:10px; border-bottom:1px solid var(--border); }
.bio-section p{ color:var(--muted); font-size:14px; line-height:1.85; margin:0 0 16px; }
.bio-section blockquote{
    margin:18px 0;
    padding:16px 20px;
    background:var(--offwhite);
    border-left:4px solid var(--gold);
    border-radius:8px;
    color:var(--green-dark);
    font-style:italic;
    font-size:14px;
    line-height:1.7;
}

.timeline-list{ list-style:none; padding:0; margin:0; display:flex; flex-direction:column; gap:12px; }
.timeline-list li{
    padding:12px 16px;
    background:var(--offwhite);
    border-left:3px solid var(--green);
    border-radius:8px;
    font-size:13px;
    color:var(--green-dark);
    font-weight:600;
}

@media(max-width:800px){
    .founder-profile{ grid-template-columns:1fr; text-align:center; }
    .founder-profile .founder-img img{ max-width:220px; margin:0 auto; }
}

/* ---- pricing package cards ---- */

.pricing-grid{ display:grid; grid-template-columns:repeat(auto-fit,minmax(260px,1fr)); gap:20px; }

.pricing-card{
    background:#fff;
    border:1px solid var(--border);
    border-radius:18px;
    padding:26px;
    box-shadow:0 10px 30px rgba(0,0,0,.05);
    opacity:0;
    transform:translateY(30px);
}

.pricing-card h3{ margin:0 0 8px; font-size:17px; color:var(--green-dark); }
.pricing-card .price{ font-size:22px; font-weight:900; color:var(--green); margin:6px 0 14px; }
.pricing-card ul{ list-style:none; padding:0; margin:0; }
.pricing-card ul li{
    font-size:12px; color:var(--muted); padding:6px 0 6px 20px; position:relative;
}
.pricing-card ul li::before{
    content:"\f00c"; font-family:"Font Awesome 6 Free"; font-weight:900; color:var(--green);
    position:absolute; left:0; font-size:10px;
}

/* ---- e-paper viewer page ---- */

.epaper-toolbar{
    background:#fff;
    border:1px solid var(--border);
    border-radius:18px;
    padding:18px 22px;
    display:flex;
    flex-wrap:wrap;
    align-items:center;
    justify-content:space-between;
    gap:14px;
    box-shadow:0 10px 30px rgba(0,0,0,.05);
}

.epaper-toolbar .date-controls{ display:flex; align-items:center; gap:10px; flex-wrap:wrap; }
.epaper-toolbar label{ font-size:13px; font-weight:800; color:var(--green-dark); }

.epaper-toolbar input[type="date"],
.epaper-toolbar select{
    padding:10px 14px;
    border-radius:10px;
    border:1px solid var(--border);
    background:var(--offwhite);
    font-family:inherit;
    font-size:13px;
    color:var(--text);
}

.epaper-market-strip{
    display:grid;
    grid-template-columns:repeat(4,1fr);
    gap:12px;
    margin-top:16px;
}

.epaper-market-strip .rate-chip{
    background:#fff;
    border:1px solid var(--border);
    border-radius:14px;
    padding:14px;
    text-align:center;
    font-size:12px;
    color:var(--muted);
}

.epaper-market-strip .rate-chip strong{ display:block; margin-top:5px; font-size:16px; color:var(--green-dark); }

.epaper-viewer-frame{
    margin-top:22px;
    background:#fff;
    border-radius:20px;
    border:1px solid var(--border);
    box-shadow:0 20px 50px rgba(0,0,0,.08);
    padding:16px;
    text-align:center;
}

.epaper-viewer-frame img{
    max-width:100%;
    border-radius:10px;
    cursor:zoom-in;
}

.thumbnail-grid{
    display:grid;
    grid-template-columns:repeat(auto-fill,minmax(120px,1fr));
    gap:14px;
}

.thumbnail-card{
    background:#fff;
    border:1px solid var(--border);
    border-radius:12px;
    overflow:hidden;
    cursor:pointer;
    text-align:center;
    transition:transform .2s ease,box-shadow .2s ease;
}

.thumbnail-card:hover{ transform:translateY(-4px); box-shadow:0 12px 30px rgba(0,0,0,.1); }
.thumbnail-card img{ width:100%; height:150px; object-fit:cover; background:var(--offwhite); }
.thumbnail-card div{ padding:8px; font-size:11px; color:var(--muted); font-weight:700; }

@media(max-width:700px){
    .epaper-market-strip{ grid-template-columns:1fr 1fr; }
}

/* ---- search bar (jobs, listings) ---- */

.search-bar-form{
    display:flex;
    gap:10px;
    max-width:600px;
    margin:22px auto 0;
    flex-wrap:wrap;
}

.search-bar-form input{
    flex:1;
    min-width:220px;
    padding:13px 16px;
    border-radius:12px;
    border:1px solid rgba(255,255,255,.2);
    background:rgba(255,255,255,.08);
    color:#fff;
    font-size:14px;
    font-family:inherit;
}

.search-bar-form input::placeholder{ color:rgba(255,255,255,.55); }
.search-bar-form input:focus{ outline:none; border-color:var(--gold); background:rgba(255,255,255,.14); }

/* ---- job card ---- */

.job-card{
    position:relative;
    background:#fff;
    border:1px solid var(--border);
    border-radius:18px;
    overflow:hidden;
    transition:transform .25s ease,box-shadow .25s ease;
}

.job-card:hover{ transform:translateY(-5px); box-shadow:0 16px 40px rgba(0,0,0,.08); }

.job-card .featured-badge{
    position:absolute;
    top:14px; right:14px;
    z-index:2;
    background:linear-gradient(135deg,#ffe39a,#cda447);
    color:#14261e;
    font-size:10px;
    font-weight:900;
    padding:5px 10px;
    border-radius:20px;
    text-transform:uppercase;
    letter-spacing:.5px;
}

.job-card .job-image{ width:100%; height:170px; object-fit:cover; background:#e7eee9; }
.job-card .job-content{ padding:22px; }
.job-card h3{ margin:0 0 6px; font-size:17px; color:var(--green-dark); }
.job-card .job-company{ color:var(--muted); font-size:13px; font-weight:700; margin-bottom:10px; }

.job-card .job-meta{ display:flex; flex-wrap:wrap; gap:10px; margin-bottom:14px; }
.job-card .job-meta-item{
    font-size:11px;
    font-weight:800;
    color:var(--green);
    background:rgba(8,116,67,.08);
    padding:5px 10px;
    border-radius:8px;
}

.job-card .job-description{
    font-size:13px;
    color:var(--muted);
    line-height:1.6;
    margin-bottom:16px;
    max-height:90px;
    overflow:hidden;
}

.job-card .apply-btn{
    display:inline-flex;
    align-items:center;
    gap:6px;
    padding:10px 16px;
    border-radius:10px;
    background:var(--green);
    color:#fff;
    text-decoration:none;
    font-weight:800;
    font-size:13px;
}

.empty-state{
    text-align:center;
    padding:60px 20px;
    color:var(--muted);
    background:#fff;
    border:1px dashed var(--border);
    border-radius:18px;
}

.empty-state i{ font-size:34px; color:#c9d6ce; margin-bottom:14px; display:block; }

/* ---- simple table (rate cards etc.) ---- */

.rate-table{ width:100%; border-collapse:collapse; background:#fff; border-radius:16px; overflow:hidden; box-shadow:0 10px 30px rgba(0,0,0,.05); }
.rate-table th,
.rate-table td{ padding:14px 18px; text-align:left; font-size:13px; border-bottom:1px solid var(--border); }
.rate-table th{ background:var(--green-dark); color:#fff; font-weight:800; text-transform:uppercase; font-size:11px; letter-spacing:.5px; }
.rate-table tr:last-child td{ border-bottom:0; }
.rate-table tr:hover td{ background:var(--offwhite); }

/* ---- legal / policy text pages ---- */

.legal-content{ max-width:900px; margin:0 auto; }
.legal-content h2{ color:var(--green-dark); font-size:22px; margin:34px 0 12px; }
.legal-content h2:first-child{ margin-top:0; }
.legal-content p{ color:var(--muted); font-size:14px; line-height:1.85; margin:0 0 14px; }
.legal-content ul,
.legal-content ol{ color:var(--muted); font-size:14px; line-height:1.85; padding-left:22px; margin:0 0 14px; }
.legal-content .updated-note{ color:var(--muted); font-size:12px; font-style:italic; margin-bottom:30px; }

@media(max-width:850px){
    .feature-grid,
    .profile-grid,
    .listing-grid{ grid-template-columns:1fr; }
    .form-grid{ grid-template-columns:1fr; }
    .showcase-panel{ padding:34px 24px; flex-direction:column; text-align:center; }
    .rate-table{ display:block; overflow-x:auto; }
}

@media(prefers-reduced-motion:reduce){
    *,*::before,*::after{ animation:none !important; transition:none !important; }
}

/* =========================================================
   EVENTS SYSTEM
========================================================= */

.event-date-badge{
    display:inline-flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    background:var(--green-dark);
    color:#fff;
    border-radius:12px;
    padding:8px 12px;
    min-width:54px;
    line-height:1.1;
}
.event-date-badge .ev-day{ font-size:20px; font-weight:900; color:var(--gold-light); }
.event-date-badge .ev-mon{ font-size:11px; text-transform:uppercase; letter-spacing:1px; }

.event-card-top{ display:flex; align-items:flex-start; gap:12px; margin-bottom:12px; }
.event-card-top h3{ margin:0; font-size:17px; color:var(--green-dark); }

.event-card .job-meta-item i{ margin-right:4px; }

/* ---- countdown: compact (cards / widget) ---- */
.event-countdown-compact{
    display:inline-flex;
    align-items:center;
    gap:6px;
    flex-wrap:wrap;
    font-size:12px;
    font-weight:800;
    color:var(--green);
    background:rgba(8,116,67,.08);
    padding:6px 10px;
    border-radius:20px;
    margin:8px 0;
}
.event-countdown-compact .countdown-compact-label{ color:var(--muted); font-weight:700; text-transform:none; }
.event-countdown-compact.is-ended{ background:rgba(215,25,32,.10); color:var(--red); }
.event-countdown-compact .countdown-ended-text{ font-weight:900; }

/* ---- countdown: full (event detail page) ---- */
.event-countdown-full{
    background:linear-gradient(135deg,#032f25,#07583e);
    border-radius:20px;
    padding:22px 24px;
    color:#fff;
    margin:24px 0;
    text-align:center;
}
.event-countdown-full .countdown-label{
    font-size:12px;
    text-transform:uppercase;
    letter-spacing:1.5px;
    color:var(--gold-light);
    font-weight:800;
    margin-bottom:14px;
}
.event-countdown-full .countdown-units{
    display:grid;
    grid-template-columns:repeat(4,1fr);
    gap:14px;
    max-width:420px;
    margin:0 auto;
}
.event-countdown-full .countdown-unit span{
    display:block;
    font-size:clamp(24px,4vw,34px);
    font-weight:900;
    color:#fff;
}
.event-countdown-full .countdown-unit small{
    display:block;
    font-size:11px;
    text-transform:uppercase;
    letter-spacing:1px;
    color:rgba(255,255,255,.65);
    margin-top:2px;
}
.event-countdown-full.is-ended .countdown-ended-text{
    display:block;
    font-size:22px;
    font-weight:900;
    color:var(--gold-light);
    padding:10px 0;
}

@media(max-width:600px){
    .event-countdown-full .countdown-units{ gap:8px; }
}

