/*==================================
ABSTRACT GUIDELINES
==================================*/

.abstract-guidelines{

    padding:50px 0;

    background:
    linear-gradient(135deg,#f8fbff,#ffffff);

    position:relative;

    overflow:hidden;

}


/*-----------------------------------
BACKGROUND PATTERN
-----------------------------------*/

.abstract-guidelines::before{

    content:"";
    position:absolute;
    inset:0;

    background-image:
    linear-gradient(rgba(31,86,168,.03) 1px, transparent 1px),
    linear-gradient(90deg, rgba(31,86,168,.03) 1px, transparent 1px);

    background-size:60px 60px;

}


.abstract-guidelines::after{

    content:"";

    position:absolute;

    width:400px;
    height:400px;

    top:-150px;
    right:-150px;

    border-radius:50%;

    background:
    radial-gradient(circle,
    rgba(248,119,14,.08),
    transparent 70%);

}



/* TITLE */

.section-title{

text-align:center;

margin-bottom:60px;

position:relative;

z-index:2;

}

.section-title span{

display:inline-block;

padding:8px 20px;

background:#eef5ff;

color:#1f56a8;

font-weight:700;

border-radius:30px;

letter-spacing:1px;

margin-bottom:15px;

}

.section-title h2{

font-size:44px;

font-weight:800;

color:#22356c;

margin-bottom:15px;

}

.section-title p{

max-width:700px;

margin:auto;

font-size:17px;

color:#666;

line-height:1.8;

}



/* GRID */

.guideline-grid{

display:grid;

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

gap:30px;

}



/* CARD */

.guideline-card{

display:flex;

gap:25px;

padding:35px;

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

backdrop-filter:blur(12px);

border-radius:22px;

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

box-shadow:

0 15px 40px rgba(0,0,0,.06);

transition:.35s;

position:relative;

overflow:hidden;

}

.guideline-card:hover{

transform:translateY(-10px);

box-shadow:

0 20px 45px rgba(31,86,168,.15);

}



/* LEFT NUMBER */

.number{

min-width:70px;

height:70px;

background:

linear-gradient(135deg,
#1f56a8,
#3c7ad4);

color:white;

font-size:28px;

font-weight:800;

border-radius:50%;

display:flex;

justify-content:center;

align-items:center;

box-shadow:

0 8px 20px rgba(31,86,168,.25);

}



/* TEXT */

.guideline-card h4{

font-size:25px;

font-weight:700;

color:#22356c;

margin-bottom:12px;

}

.guideline-card p{

color:#666;

font-size:17px;

line-height:1.8;

margin:0;

}



/* STRUCTURE */

.structure-card ul{

padding:0;

margin:20px 0 0;

list-style:none;

}

.structure-card li{

display:flex;

justify-content:space-between;

align-items:center;

padding:14px 18px;

margin-bottom:12px;

background:#f8fbff;

border-left:4px solid #f8770e;

border-radius:12px;

}

.structure-card strong{

color:#22356c;

}

.structure-card span{

color:#666;

}



/* Tablet */

@media(max-width:991px){

.guideline-grid{

grid-template-columns:1fr;

}

.section-title h2{

font-size:36px;

}

}



/* Mobile */

@media(max-width:576px){

.abstract-guidelines{

padding:50px 15px;

}

.guideline-card{

flex-direction:column;

text-align:center;

padding:25px;

}

.number{

margin:auto;

}

.guideline-card h4{

font-size:22px;

}

.structure-card li{

flex-direction:column;

gap:8px;

text-align:center;

}

.section-title h2{

font-size:30px;

}

.section-title p{

font-size:15px;

}

}