/* ==========================================
   ORTHOAI CONGRESS 2026
   style.css
========================================== */

/* ---------- Fonts ---------- */

@font-face{
    font-family:'BTitr';
    src:url('../fonts/btitr.ttf');
}

@font-face{
    font-family:'BKoodak';
    src:url('../fonts/bkoodak.ttf');
}
@font-face{
    font-family:'Dastnevis';
    src:url('../fonts/dastnevis.otf');
}


/* ---------- Colors ---------- */

:root{

    --primary:#0A4D8C;

    --dark:#052D56;

    --light:#F7F9FC;

    --text:#2C2C2C;

    --gray:#777;

    --border:#E8E8E8;

    --white:#fff;

}

/* ---------- Reset ---------- */

*{

margin:0;

padding:0;

box-sizing:border-box;

}

html{

scroll-behavior:smooth;

}

body{

font-family:BKoodak,Tahoma;

background:#fff;

color:var(--text);

direction:rtl;

overflow-x:hidden;

}

img{

display:block;

max-width:100%;

}

a{

text-decoration:none;

color:inherit;

}

ul{

list-style:none;

}

button{

border:none;

background:none;

cursor:pointer;

}

/* ---------- Container ---------- */

.container{

width:min(94%,1400px);

margin:auto;

}

/* ---------- Overlay ---------- */

#overlay{

position:fixed;

inset:0;

background:rgba(0,0,0,.35);

opacity:0;

visibility:hidden;

transition:.3s;

z-index:900;

}

#overlay.show{

opacity:1;

visibility:visible;

}

/* ---------- Header ---------- */

.header{

position:fixed;

top:0;

right:0;

left:0;

height:78px;

background:#fff;

box-shadow:0 3px 14px rgba(0,0,0,.08);

z-index:1000;

}

.header .container{

height:78px;

display:flex;

align-items:center;

justify-content:space-between;

}

/* ---------- Logo ---------- */

.logo img{

height:58px;

}

/* ---------- Desktop Menu ---------- */

.desktop-menu>ul{

display:flex;

align-items:center;

gap:8px;

}

.desktop-menu>ul>li{

position:relative;

}

.desktop-menu>ul>li>a,

.dropdown-btn{

display:flex;

align-items:center;

gap:6px;

padding:28px 14px;

font-family:BTitr;

font-size:18px;

color:var(--dark);

transition:.25s;

}

.desktop-menu>ul>li>a:hover,

.dropdown-btn:hover{

color:var(--primary);

}

/* ---------- Arrow ---------- */

.arrow{

width:12px;

height:12px;

stroke:currentColor;

stroke-width:2;

fill:none;

transition:.25s;

}

/* ---------- Dropdown ---------- */

.submenu{

position:absolute;

top:100%;

right:0;

width:250px;

background:#fff;

border:1px solid var(--border);

border-radius:12px;

box-shadow:0 10px 30px rgba(0,0,0,.10);

display:none;

overflow:hidden;

}

.submenu.show{

display:block;

}

.submenu li a{

display:block;

padding:14px 18px;

font-size:17px;

color:#444;

transition:.2s;

}

.submenu li a:hover{

background:#F3F8FD;

color:var(--primary);

}

/* ---------- Hamburger ---------- */

.menu-button{

width:40px;
height:40px;

border-radius:8px;

padding:0;

display:flex;

align-items:center;

justify-content:center;

}

.menu-button:hover{

background:#F5F7FB;

}

/* ---------- Mobile Menu ---------- */

.mobile-menu{

position:fixed;

top:0;

right:-330px;

width:320px;

height:100vh;

background:#fff;

box-shadow:-5px 0 20px rgba(0,0,0,.18);

transition:.35s;

z-index:1100;

overflow-y:auto;

}

.mobile-menu.open{

right:0;

}

.mobile-top{

height:70px;

padding:0 20px;

display:flex;

align-items:center;

justify-content:space-between;

border-bottom:1px solid var(--border);

}

.mobile-top h3{

font-family:BTitr;

font-size:22px;

color:var(--dark);

}

/* ---------- Close ---------- */

.close-button{

width:40px;

height:40px;

display:flex;

align-items:center;

justify-content:center;

border-radius:10px;

}

.close-button:hover{

background:#f4f4f4;

}

/* ---------- Mobile List ---------- */

.mobile-menu>ul{

padding:12px;

}

.mobile-menu li{

margin-bottom:4px;

}

.mobile-menu a,

.mobile-register{

width:100%;

display:flex;

align-items:center;

justify-content:space-between;

padding:14px 16px;

font-size:18px;

border-radius:10px;

color:#333;

font-family:BKoodak;

transition:.2s;

}

.mobile-menu a:hover,

.mobile-register:hover{

background:#F3F8FD;

color:var(--primary);

}

/* ---------- Mobile Submenu ---------- */

.mobile-submenu{

display:none;

padding-right:18px;

}

.mobile-submenu.show{

display:block;

}

.mobile-submenu a{

font-size:16px;

padding:12px 14px;

}
/* ==========================================
   HERO
========================================== */

.hero{

margin-top:95px;

padding:20px 0 35px;

background:#fff;

}

.hero-container{

width:min(95%,1400px);

margin:auto;

display:grid;

grid-template-columns:5fr 1fr;

gap:18px;

align-items:start;

}

/* =====================
   Slider
======================*/

.slider{

position:relative;

width:100%;

/* نسبت واقعی بنر شما */

aspect-ratio:1774/877;

background:#fff;

border-radius:18px;

overflow:hidden;

border:1px solid var(--border);

box-shadow:0 10px 25px rgba(0,0,0,.08);

}

/* اسلایدها */

.slides{

position:relative;

width:100%;

height:100%;

}

/* هر اسلاید */

.slide{

position:absolute;

inset:0;

opacity:0;

transition:opacity .6s ease;

pointer-events:none;

}

.slide.active{

opacity:1;

pointer-events:auto;

}

/* بنر */

.slide img{

width:100%;

height:100%;

/* کل بنر دیده شود */

object-fit:contain;

object-position:center;

background:#fff;

}

/* =====================
   Buttons
======================*/

.slider-btn{

position:absolute;

top:50%;

transform:translateY(-50%);

width:44px;

height:44px;

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

border-radius:50%;

display:flex;

align-items:center;

justify-content:center;

box-shadow:0 3px 12px rgba(0,0,0,.15);

transition:.25s;

z-index:50;

}

.slider-btn:hover{

background:var(--primary);

}

.slider-btn:hover svg{

stroke:#fff;

}

.slider-btn svg{

width:18px;

height:18px;

stroke:var(--dark);

stroke-width:2.4;

fill:none;

}

.prev{

right:15px;

}

.next{

left:15px;

}

/* =====================
   Dots
======================*/

.slider-dots{

position:absolute;

bottom:15px;

left:50%;

transform:translateX(-50%);

display:flex;

gap:10px;

z-index:60;

}

.dot{

width:11px;

height:11px;

border-radius:50%;

background:#d7d7d7;

cursor:pointer;

transition:.3s;

}

.dot.active{

background:var(--primary);

transform:scale(1.25);

}

/* =====================
 Desktop Counter
======================*/

.counter-desktop{

display:flex;

flex-direction:column;

gap:14px;

height:100%;

}

.counter-card{

flex:1;

background:linear-gradient(180deg,#0A4D8C,#06396D);

border-radius:18px;

display:flex;

flex-direction:column;

justify-content:center;

align-items:center;

color:#fff;

min-height:120px;

box-shadow:0 8px 22px rgba(0,0,0,.12);

}

.counter-number{

font-size:42px;

font-family:BTitr;

line-height:1;

}

.counter-title{

margin-top:10px;

font-size:20px;

font-family:BKoodak;

}

/* =====================
 Mobile Counter
======================*/

.counter-mobile{

display:none;

width:min(95%,1400px);

margin:18px auto 0;

background:#0A4D8C;

color:#fff;

padding:15px;

border-radius:12px;

text-align:center;

font-family:BTitr;

font-size:22px;

box-shadow:0 8px 18px rgba(0,0,0,.10);

}

/* =====================
 Images
======================*/

/* ---------- Base ---------- */
body{
    margin:0;
    padding:0;
    background:#f7f7f7;
    font-family:'BKoodak', sans-serif;
}

/* ---------- Container ---------- */
.wrapper{
    max-width:1200px;
    margin:auto;
    padding:20px;
}

/* ---------- Section Box ---------- */
.section{
    margin-bottom:40px;
    background:#fff;
    border-radius:16px;
    overflow:hidden;
    box-shadow:0 4px 15px rgba(0,0,0,0.08);
}

/* ---------- Title ---------- */
.section-title{
    font-family:'BTitr';
    font-size:22px;
    padding:15px 20px;
    background:#0d6efd;
    color:#fff;
}

/* ---------- Image ---------- */
.section img{
    width:100%;
    height:auto;
    display:block;
}

/* ---------- Mobile Adjust ---------- */
@media (max-width:768px){

    .wrapper{
        padding:10px;
    }

    .section-title{
        font-size:18px;
        text-align:center;
    }
}



  

/* =====================
 Responsive
======================*/

@media(max-width:992px){

.hero-container{

grid-template-columns:1fr;

}

.counter-desktop{

display:none;

}

.counter-mobile{

display:block;

}

.slider{

border-radius:14px;

}

}

/* =====================
 Mobile
======================*/

@media(max-width:768px){

.hero{

margin-top:78px;

padding-top:12px;

}

.slider{

border-radius:10px;

}

.slider-btn{

width:36px;

height:36px;

}

.slider-btn svg{

width:15px;

height:15px;

}

.prev{

right:8px;

}

.next{

left:8px;

}

.dot{

width:9px;

height:9px;

}

.counter-mobile{

font-size:18px;

padding:12px;

}

}
/*=========================================
    SECTION
=========================================*/

.section{

width:min(95%,1400px);

margin:55px auto;

}

.section-title{

text-align:center;

font-family:BTitr;

font-size:34px;

color:var(--dark);

margin-bottom:30px;

position:relative;

}

.section-title::after{

content:"";

display:block;

width:90px;

height:4px;

background:var(--primary);

margin:10px auto;

border-radius:20px;

}

/*=========================================
    Committee Images
=========================================*/

.committee-image{

background:#fff;

border-radius:18px;

overflow:hidden;

border:1px solid #E5E5E5;

box-shadow:0 10px 25px rgba(0,0,0,.08);

transition:.35s;

}

.committee-image:hover{

transform:translateY(-5px);

box-shadow:0 18px 40px rgba(0,0,0,.15);

}

.committee-image img{

width:100%;

display:block;

height:auto;

}

/*=========================================
    Footer
=========================================*/
.footer-container{

display:grid;

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

gap:40px;

align-items:start;

width:100%;

}

@media(max-width:768px){

.footer-container{

grid-template-columns:1fr;

text-align:center;

}

}
/*=========================================
    Animation
=========================================*/

.fade-up{

opacity:0;

transform:translateY(40px);

transition:all .7s ease;

}

.fade-up.show{

opacity:1;

transform:none;

}

/*=========================================
    Responsive
=========================================*/

@media(max-width:992px){

.desktop-menu{

display:none;

}

.menu-button{

display:flex;

}

.footer-container{

grid-template-columns:1fr;

text-align:center;

}

.footer-links{

align-items:center;

}

.section-title{

font-size:28px;

}

}

/*=========================================
    Mobile
=========================================*/

@media(max-width:768px){

.logo img{

height:48px;

}

.header{

height:68px;

}

.header .container{

height:68px;

}

.mobile-menu{

width:290px;

}

.section{

margin:35px auto;

}

.section-title{

font-size:24px;

}

.footer{

padding:35px 15px;

}

.footer-title{

font-size:20px;

}

.footer-links a{

font-size:17px;

}

.footer-copy{

font-size:14px;

}

}

/*=========================================
    Large Screens
=========================================*/

@media(min-width:1500px){

.container,

.hero-container,

.section,

.footer-container{

max-width:1500px;

}

}
.mobile-menu a{

display:block;

padding:14px 18px;

font-size:17px;

border-bottom:1px solid #eee;

color:#222;

font-family:BKoodak;

}

.mobile-menu a:hover{

background:#f5f7fb;

color:#0A4D8C;

}

.close-button{

font-size:26px;

background:none;

border:none;

cursor:pointer;

}
.two-cols{

display:grid;

grid-template-columns:1fr 1fr;

gap:30px;

margin-top:35px;

align-items:start;

}

@media(max-width:900px){

.two-cols{

grid-template-columns:1fr;

}

}

.news-title{
    font-family:"Dastnevis";
    font-size:20px;        /* کاهش از 28 */
    line-height:1.4;       /* خیلی مهم: از 2.2 به 1.4 */
    white-space:pre-line;
    direction:rtl;
    text-align:right;

    max-width:100%;
}
.news-box{
    max-width:800px;
    margin:auto;
    padding:10px 15px;
}
@media (max-width:768px){
    .news-title{
        font-size:16px;
        line-height:1.5;
    }
}

/* ---------- FANCY ---------- */

.fancy-box{

display:flex;

flex-direction:column;

align-items:center;

justify-content:center;

text-align:center;

}

.fancy-circle{

width:120px;

height:120px;

border-radius:50%;

background:conic-gradient(#0A4D8C,#4aa3ff,#0A4D8C);

animation:spin 6s linear infinite;

margin:20px 0;

}

@keyframes spin{

from{transform:rotate(0deg);}
to{transform:rotate(360deg);}

}

.ai-image{

width:95%;

max-width:420px;

display:block;

margin:auto;

}

.fancy-box p{

font-family:"BTitr";

font-size:22px;

text-align:center;

margin-top:15px;

}

/* ---------- POSTER ---------- */

.poster{

display:flex;

justify-content:center;

gap:20px;

margin-top:15px;

}
.poster-card{

text-align:center;

padding:15px;

border:1px solid #ddd;

border-radius:12px;

background:#fff;

width:160px;

}
.modal{

display:none;

position:fixed;

inset:0;

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

justify-content:center;

align-items:center;

z-index:9999;

}

.modal img{

max-width:90%;

max-height:90%;

border-radius:10px;

box-shadow:0 10px 30px rgba(0,0,0,.4);

}
.news-title{

font-family: "Dastnevis", sans-serif;

direction: rtl;

unicode-bidi: plaintext;

}
.ai-image{
width:90%;
max-width:380px;
display:block;
margin:auto;
}
.section{
    margin-bottom:40px;
    background:#fff;
    border-radius:16px;
    overflow:hidden;
    box-shadow:0 4px 20px rgba(0,0,0,0.08);

    transform: translateY(0);
    animation: floatSection 6s ease-in-out infinite;
}

@keyframes floatSection{
    0%   { transform: translateY(0px); }
    50%  { transform: translateY(-8px); }
    100% { transform: translateY(0px); }
}
.section{
    opacity:0;
    animation: fadeUp 0.8s ease forwards;
}

.section:nth-child(1){ animation-delay:0.1s; }
.section:nth-child(2){ animation-delay:0.3s; }

@keyframes fadeUp{
    from{
        opacity:0;
        transform: translateY(30px) scale(0.98);
    }
    to{
        opacity:1;
        transform: translateY(0) scale(1);
    }
}
.section{
    transition: all 0.4s ease;
}

.section:hover{
    transform: translateY(-6px) scale(1.01);
    box-shadow:0 10px 30px rgba(0,0,0,0.15);
}
.section-title{
    background: linear-gradient(135deg,#0d6efd,#6f42c1);
}
.slogan{
    font-family: "BKoodak";
    font-size: 22px;
    text-align: center;
    margin-top: 12px;
    color: #222;

    direction: rtl;

    /* فانتزی‌تر شدن */
    padding: 8px 15px;
    display: inline-block;

    background: linear-gradient(135deg, #e0f7ff, #f3e8ff);
    border-radius: 12px;

    box-shadow: 0 5px 15px rgba(0,0,0,0.08);

    animation: fadeUp 0.8s ease forwards;
}

/* انیمیشن نرم ورود */
@keyframes fadeUp{
    from{
        opacity:0;
        transform: translateY(15px);
    }
    to{
        opacity:1;
        transform: translateY(0);
    }
}

/* موبایل */
@media (max-width:768px){
    .slogan{
        font-size: 16px;
        padding: 6px 12px;
    }
}
.topics-list{
    list-style: none;
    padding: 0;
    margin: 20px auto;

    text-align: center;
    direction: rtl;

    max-width: 700px;
}

.topics-list li{
    font-family: "BKoodak";
    font-size: 18px;

    margin: 10px 0;
    padding: 10px 15px;

    display: inline-block;
    width: 100%;

    background: linear-gradient(135deg, #f5f7ff, #eefcff);
    border-radius: 12px;

    box-shadow: 0 4px 12px rgba(0,0,0,0.08);

    transition: all 0.3s ease;
}

/* Hover فانتزی */
.topics-list li:hover{
    transform: translateY(-4px) scale(1.02);
    box-shadow: 0 8px 18px rgba(0,0,0,0.12);
}

/* موبایل */
@media (max-width:768px){
    .topics-list li{
        font-size: 15px;
        padding: 8px 12px;
    }
}
.intro{
    max-width:900px;
    margin:auto;
    padding:30px 20px;
    text-align:center;
    direction:rtl;
}

/* تیتر اصلی */
.intro-title{
    font-family:"BTitr";
    font-size:34px;
    color:#111;
    margin-bottom:10px;
}

/* زیرتیتر */
.intro-subtitle{
    font-family:"BTitr";
    font-size:20px;
    color:#0d6efd;
    margin-bottom:20px;
}

/* متن */
.intro-text{
    font-family:"BKoodak";
    font-size:18px;
    line-height:1.8;
    color:#333;
    margin-bottom:30px;
}

/* دکمه‌ها */
.intro-buttons{
    display:flex;
    flex-wrap:wrap;
    justify-content:center;
    gap:12px;
}

/* دکمه پایه */
.btn{
    font-family:"BKoodak";
    font-size:16px;
    padding:10px 18px;
    border-radius:12px;
    text-decoration:none;
    transition:all .3s ease;
    display:inline-block;
}

/* دکمه اصلی */
.btn.primary{
    background:#0d6efd;
    color:#fff;
}

/* دکمه دوم */
.btn.secondary{
    background:#6f42c1;
    color:#fff;
}

/* دکمه خطی */
.btn.outline{
    border:2px solid #0d6efd;
    color:#0d6efd;
    background:transparent;
}

/* Hover */
.btn:hover{
    transform:translateY(-3px);
    box-shadow:0 6px 15px rgba(0,0,0,.15);
}

/* موبایل */
@media (max-width:768px){

    .intro-title{
        font-size:24px;
    }

    .intro-subtitle{
        font-size:16px;
    }

    .intro-text{
        font-size:15px;
        line-height:1.7;
    }

    .intro-buttons{
        flex-direction:column;
    }

    .btn{
        width:100%;
        text-align:center;
    }

}
/* ================= LAYOUT ================= */
.two-cols.layout-clean{
    display:flex;
    gap:20px;
    align-items:stretch;
}

/* ستون‌ها */
.col-left,
.col-right{
    flex:1;
    display:flex;
    flex-direction:column;
}

.col-right{
    flex:2px;
}

/* ================= CARD ================= */
.card{
    background:#fff;
    border-radius:16px;
    padding:15px;
    box-shadow:0 6px 18px rgba(0,0,0,0.08);
}

/* ================= TITLES ================= */
.btitr{
    font-family:"BTitr";
}

/* ================= TOPICS ================= */
.topics-list{
    list-style:none;
    padding:0;
    margin:0;
}

.topics-list li{
    font-family:"BKoodak";
    font-size:16px;
    margin:8px 0;
}

/* ================= POSTERS ================= */
.poster{
    display:flex;
    gap:10px;
    justify-content:center;   /* وسط چین واقعی */
    flex-wrap:wrap;
}

.poster-card{
    flex:0 1 200px;
    text-align:center;
}

.poster-thumb{
    width:60%;
    border-radius:10px;
    cursor:pointer;
    transition:0.3s;
}

.poster-thumb:hover{
    transform:scale(1.05);
}

/* ================= GOALS ================= */
.goals-box{
    display:flex;
    gap:8px;
    align-items:flex-start;
    margin-top:10px;
}

/* لوگو کوچک و مینیمال */
.goal-img{
    width:10px;
    height:10px;
    object-fit:contain;
    flex-shrink:0;
    opacity:0.85;
}

.goals-box p{
    font-family:"BKoodak";
    font-size:15px;
    line-height:1.9;
    margin:0;
}

/* ================= BUTTONS ================= */
.btn-group{
    display:flex;
    gap:10px;
    flex-wrap:wrap;
}

.btn{
    font-family:"BKoodak";
    padding:10px 14px;
    border-radius:10px;
    text-decoration:none;
    transition:0.3s;
}

.btn.gray{
    background:#6c757d;
    color:#fff;
}

.btn.dark{
    background:#111;
    color:#fff;
}

.btn:hover{
    transform:translateY(-3px);
    box-shadow:0 8px 18px rgba(0,0,0,0.2);
}

/* ================= MOBILE FIX (IMPORTANT) ================= */
@media (max-width:768px){

    /* ❌ جلوگیری کامل از دو ستونه شدن */
    .two-cols.layout-clean{
        display:block !important;
    }

    /* پوسترها وسط */
    .poster{
        flex-direction:column;
        align-items:center;
    }

    .poster-card{
        width:100%;
        max-width:280px;
    }

    /* اهداف تک ستونه */
    .goals-box{
        display:block;
        text-align:center;
    }

    /* لوگو خیلی کوچک در موبایل */
    .goal-img{
        width:6px;
        height:6px;
        margin:0 auto 8px;
    }

    /* دکمه‌ها تمام عرض */
    .btn{
        width:100%;
        text-align:center;
    }
}
/* کل بخش */
.org-section{
    padding:40px 10px;
    direction:rtl;
    background:#f5f7fb;
}

/* کانتینر افقی */
.org-container{
    display:flex;
    gap:12px;
    justify-content:center;
    align-items:stretch;
    flex-wrap:nowrap;
    overflow-x:auto;
    padding-bottom:10px;
}

/* ستون‌ها */
.org-col{
    min-width:160px;
    height:260px;

    display:flex;
    align-items:center;
    justify-content:center;

    text-align:center;

    font-family:"BTitr";
    font-size:16px;
    color:#fff;

    padding:10px;
    border-radius:16px;

    writing-mode:vertical-rl;  /* عمودی واقعی */
    transform:rotate(180deg);  /* خوانا کردن متن */

    box-shadow:0 10px 25px rgba(0,0,0,0.2);
    transition:0.3s;
}

/* hover */
.org-col:hover{
    transform:rotate(180deg) scale(1.05);
}

/* رنگ‌های سنگین و جذاب */
.c1{ background:linear-gradient(135deg,#1f4037,#99f2c8); }
.c2{ background:linear-gradient(135deg,#232526,#414345); }
.c3{ background:linear-gradient(135deg,#0f2027,#203a43,#2c5364); }
.c4{ background:linear-gradient(135deg,#41295a,#2F0743); }
.c5{ background:linear-gradient(135deg,#e52d27,#b31217); }
.c6{ background:linear-gradient(135deg,#373B44,#4286f4); }
.c7{ background:linear-gradient(135deg,#134E5E,#71B280); }

/* اسکرول بهتر موبایل */
.org-container::-webkit-scrollbar{
    height:6px;
}

.org-container::-webkit-scrollbar-thumb{
    background:#999;
    border-radius:10px;
}

/* موبایل */
@media (max-width:768px){
    .org-col{
        min-width:140px;
        height:200px;
        font-size:14px;
    }
}
/* کل فوتر */
.site-footer{
    background: linear-gradient(135deg,#0f2027,#203a43,#2c5364);
    color:#fff;
    padding:40px 20px;
    margin-top:40px;
}

/* کانتینر */
.footer-container{
    max-width:1000px;
    margin:auto;
    text-align:center;
}

/* تیتر */
.footer-title{
    font-family:"BTitr";
    font-size:22px;
    margin-bottom:20px;
}

/* اطلاعات */
.footer-info p{
    font-family:"BKoodak";
    font-size:15px;
    margin:8px 0;
    line-height:1.7;
}

/* شبکه‌ها */
.footer-social{
    margin-top:20px;
    display:flex;
    justify-content:center;
    gap:10px;
    flex-wrap:wrap;
}

/* دکمه‌های اجتماعی */
.social{
    font-family:"BKoodak";
    text-decoration:none;
    padding:8px 14px;
    border-radius:10px;
    color:#fff;
    transition:0.3s;
    font-size:14px;
}

/* رنگ‌ها */
.social.tg{ background:#229ED9; }
.social.wa{ background:#25D366; }
.social.bl{ background:#1e88e5; }

/* hover */
.social:hover{
    transform:translateY(-3px);
    box-shadow:0 8px 18px rgba(0,0,0,0.3);
}

/* موبایل */
@media (max-width:768px){

    .footer-title{
        font-size:18px;
    }

    .footer-info p{
        font-size:13px;
    }

    .social{
        width:100%;
        text-align:center;
    }
}
.logo-wrap{
    display:flex;
    justify-content:center;
    align-items:center;
}

/* 👇 این نسخه هیچ CSS دیگری را اجازه override نمی‌دهد */
img.mini-logo{
    width:120px !important;
    height:120px !important;
    max-width:160px !important;
    max-height:160px !important;

    object-fit:contain !important;
    display:block !important;

    margin:0 auto !important;
}
/*==========================
      PROGRAM
==========================*/

.program{

width:min(95%,1200px);

margin:70px auto;

}

.program-days{

display:flex;

justify-content:center;

gap:15px;

margin:40px 0;

flex-wrap:wrap;

}

.day-btn{

padding:18px 35px;

border:none;

border-radius:16px;

background:#eef5ff;

cursor:pointer;

font-family:BTitr;

font-size:20px;

transition:.3s;

}

.day-btn span{

font-size:15px;

color:#666;

}

.day-btn.active{

background:#0A4D8C;

color:#fff;

box-shadow:0 10px 25px rgba(10,77,140,.25);

}

.schedule{

display:none;

animation:fade .35s;

}

.schedule.active{

display:grid;

grid-template-columns:1fr 1fr;

gap:18px;

}

.time-card{

background:#fff;

border-radius:18px;

padding:18px 22px;

display:flex;

align-items:center;

gap:20px;

box-shadow:0 8px 20px rgba(0,0,0,.08);

transition:.3s;

border-right:5px solid #0A4D8C;

}

.time-card:hover{

transform:translateY(-5px);

}

.time-card span{

min-width:85px;

height:55px;

background:#0A4D8C;

color:#fff;

border-radius:12px;

display:flex;

align-items:center;

justify-content:center;

font-family:BTitr;

font-size:22px;

}

.time-card h3{

font-size:19px;

font-weight:normal;

line-height:1.8;

}

@media(max-width:768px){

.schedule.active{

grid-template-columns:1fr;

}

.day-btn{

width:100%;

}

.time-card{

flex-direction:column;

text-align:center;

}

.time-card span{

width:100%;

}

}
.time-card div{
    flex:1;
}

.time-card h3{
    margin:0 0 8px;
    color:#0A4D8C;
    font-size:20px;
}

.time-card p{
    margin:0;
    line-height:1.9;
    color:#444;
}

.time-card small{
    display:block;
    margin-top:8px;
    color:#777;
}

.break-card{
    border-right:6px solid #ff9800;
    background:#fff8ef;
}

.panel-card{
    border-right:6px solid #009688;
    background:#eefbf9;
}

.end-card{
    border-right:6px solid #4caf50;
    background:#eef9f1;
}
/*==========================
      Workshops
==========================*/

.workshops{

    width:min(95%,1200px);

    margin:80px auto;

}

.table-responsive{

    overflow-x:auto;

    border-radius:18px;

}

.workshop-table{

    width:100%;

    border-collapse:collapse;

    background:#fff;

    border-radius:18px;

    overflow:hidden;

    box-shadow:0 10px 30px rgba(0,0,0,.08);

}

.workshop-table thead{

    background:#0A4D8C;

    color:#fff;

}

.workshop-table th{

    padding:18px;

    font-family:BTitr;

    font-size:20px;

}

.workshop-table td{

    padding:18px;

    text-align:center;

    line-height:1.9;

    border-bottom:1px solid #eee;

}

.workshop-table tbody tr{

    transition:.3s;

}

.workshop-table tbody tr:hover{

    background:#f5f9ff;

}

.workshop-table tbody tr:nth-child(even){

    background:#fafafa;

}

@media(max-width:768px){

.workshop-table th,
.workshop-table td{

    padding:12px;

    font-size:14px;

}

}
/*==========================
      CONTACT
==========================*/

.contact-section{

    width:min(95%,1200px);
    margin:80px auto;

}

.contact-grid{

    display:grid;
    grid-template-columns:1fr 1fr;
    gap:25px;
    margin:40px 0;

}

.contact-card{

    background:#fff;
    border-radius:22px;
    padding:30px;
    box-shadow:0 10px 25px rgba(0,0,0,.08);

}

.contact-card h3{

    color:#0A4D8C;
    margin-bottom:20px;
    font-family:BTitr;
    font-size:28px;

}

.contact-card ul{

    list-style:none;
    padding:0;
    margin:0;

}

.contact-card li{

    padding:15px 0;
    border-bottom:1px solid #eee;
    line-height:2;

}

.contact-map{

    border-radius:24px;
    overflow:hidden;
    box-shadow:0 10px 30px rgba(0,0,0,.1);

}

.contact-map iframe{

    width:100%;
    height:500px;
    border:0;

}

@media(max-width:768px){

.contact-grid{

    grid-template-columns:1fr;

}

.contact-map iframe{

    height:350px;

}

}