/* ===========================
   PRESENTATION METHODS
=========================== */

.presentation-methods-section{

    background:
    radial-gradient(circle at 50% 30%,rgba(255,200,0,.08),transparent 35%),
    linear-gradient(to bottom,#090909,#050505);

}

.presentation-header{

    text-align:center;

    max-width:850px;

    margin:auto auto 80px;

}

.presentation-header h2{

    font-family:"Playfair Display",serif;

    font-size:clamp(44px,6vw,80px);

    line-height:1.05;

    margin:24px 0;

}

.presentation-header h2::first-line{

    color:var(--primary);

}

.presentation-header p{

    color:rgba(255,255,255,.72);

    line-height:1.8;

    max-width:700px;

    margin:auto;

}

/* GRID */

.presentation-grid{

    display:grid;

    grid-template-columns:repeat(2,1fr);

    gap:40px;

}

/* MONITOR */

.presentation-monitor{

    border-radius:30px;

    overflow:hidden;

    border:1px solid rgba(255,255,255,.08);

    background:#111;

    box-shadow:var(--shadow);

    transition:.4s;

}

.presentation-monitor:hover{

    transform:translateY(-10px);

}

.monitor-header{

    display:flex;

    align-items:center;

    gap:14px;

    padding:22px 28px;

    background:#1b1b1b;

    border-bottom:1px solid rgba(255,255,255,.08);

}

.record-dot{

    width:12px;

    height:12px;

    border-radius:50%;

    background:#ff3131;

    box-shadow:0 0 12px rgba(255,49,49,.7);

}

.monitor-header h3{

    font-size:26px;

}

.monitor-screen{

    padding:45px;

    text-align:center;

}

.monitor-screen i{

    font-size:72px;

    color:var(--primary);

    margin-bottom:35px;

}

.monitor-screen ul{

    list-style:none;

    display:grid;

    gap:18px;

}

.monitor-screen li{

    padding:14px 18px;

    border-radius:12px;

    background:rgba(255,255,255,.04);

    color:rgba(255,255,255,.78);

}

/* NOTE */

.presentation-note{

    margin:70px auto 0;

    max-width:900px;

    text-align:center;

    padding:28px 36px;

    border-radius:24px;

    background:rgba(255,200,0,.07);

    border:1px solid rgba(255,200,0,.18);

    font-size:18px;

    line-height:1.8;

}

/* MOBILE */

@media(max-width:900px){

.presentation-grid{

grid-template-columns:1fr;

}

}