/*======================================================
CAMOMATRIX EDITORIAL CSS
Version: 1.0
======================================================*/
/*
====================================================

CamoMatrix Editorial System

editorial_1_0.css

Created: June 2026

Purpose:
Shared presentation layer for:
- Field Reviews
- Founder Interviews
- Pattern History
- Educational Articles
- Industry Features

====================================================
*/
/*======================================================
ARTICLE LAYOUT
======================================================*/

.article-content{
    max-width:900px;
    margin:0 auto;
    line-height:1.8;
}

.article-content h2{
    margin-top:45px;
    margin-bottom:18px;
}

.article-content h3{
    margin-bottom:15px;
}

.article-content p{
    margin-bottom:20px;
}

.article-content hr{
    border:0;
    border-top:1px solid #d9d9d9;
    width:90%;
    margin:45px auto;
}

/*======================================================
ARTICLE IMAGES
======================================================*/

.article-content img{
    display:block;
    max-width:100%;
    height:auto;
    margin:30px auto;
    border-radius:8px;
}

/*======================================================
RESPONSIVE VIDEO
======================================================*/

.video-container{
    position:relative;
    width:100%;
    max-width:900px;
    margin:35px auto;
    padding-bottom:56.25%;
    height:0;
    overflow:hidden;
}

.video-container iframe{
    position:absolute;
    inset:0;
    width:100%;
    height:100%;
    border:0;
}

/*======================================================
FIELD REVIEW HEADER
======================================================*/

.field-review-banner{
    background:#2b3d2b;
    color:#fff;
    text-align:center;
    padding:18px;
    border-radius:8px;
    margin:25px 0;
}

.review-intro{
    text-align:center;
    font-size:1.05rem;
    color:#555;
    max-width:750px;
    margin:20px auto 35px;
}

/*======================================================
EDITORIAL BOXES
======================================================*/

.review-status,
.review-disclosure,
.review-method,
.review-highlights,
.review-watchlist,
.field-update,
.review-footer,
.review-meta{

    background:#f7f7f756;
    border-left:5px solid #4d6a46;
    border-radius:8px;
    padding:18px 20px;
    margin:35px 0;

}

/*======================================================
TABLES
======================================================*/

.review-table{
    width:100%;
    border-collapse:collapse;
    margin:30px 0;
}

.review-table td{
    padding:12px;
    border-bottom:1px solid #e1e1e1;
}

.review-table td:first-child{
    width:35%;
    font-weight:bold;
}

/*======================================================
LISTS
======================================================*/

.article-content ul{
    margin:18px 0;
    padding-left:1.2rem;
}

.article-content li{
    margin-bottom:12px;
    line-height:1.65;
}
.review-status ul,
.review-highlights ul,
.review-watchlist ul,
.review-footer ul,
.review-meta ul{

    margin:15px 0;
    padding-left:1.1rem;

}

.review-status li,
.review-highlights li,
.review-watchlist li,
.review-footer li,
.review-meta li{

    margin-bottom:10px;

}
.review-highlights ul,
.review-status ul,
.review-watchlist ul{

    list-style:none;
    padding-left:0;
    margin:15px 0;

}

.review-highlights li::before,
.review-status li::before,
.review-watchlist li::before{

    content:"✓";
    color:#6ea04d;
    font-weight:bold;
    margin-right:10px;

}
/*======================================================
LINKS
======================================================*/

.article-content a{
    font-weight:600;
    text-decoration:none;
}

.article-content a:hover{
    text-decoration:underline;
}

/*======================================================
IMAGE CAPTIONS
======================================================*/

.image-caption{
    text-align:center;
    color:#666;
    font-size:.9rem;
    font-style:italic;
    margin-top:-15px;
    margin-bottom:30px;
}

/*======================================================
PRO TIPS
======================================================*/

.pro-tip{

    background:#edf6e8;
    border-left:5px solid #5b8a45;
    padding:20px;
    margin:30px 0;
    border-radius:8px;

}

/*======================================================
FIELD NOTES
======================================================*/

.field-note{

    background:#fff8e7;
    border-left:5px solid #d8a400;
    padding:20px;
    margin:30px 0;
    border-radius:8px;

}

/*======================================================
MOBILE
======================================================*/

@media (max-width:768px){

.article-content{

    padding:18px;

}

.review-table td{

    display:block;
    width:100%;

}

.review-table td:first-child{

    padding-bottom:0;

}

.field-review-banner{

    font-size:.95rem;

}

.review-intro{

    font-size:1rem;

}

}