/*
Theme Name: ICDM Modern
Theme URI: https://icdm.jorahsoft.com
Author: Jorah Softwares
Author URI: https://www.jorahsoft.com
Description: A clean, modern and professional theme for the Integrated Centre For Disaster Management (ICDM). Solid white, orange and red palette with no gradients, fully responsive.
Version: 1.2.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: icdm-modern
Tags: nonprofit, ngo, orange, red, modern, responsive
*/

/* ============================================================
   DESIGN TOKENS — solid white / orange / red
   ============================================================ */
:root {
	--orange:#ff9d00;        /* primary brand (fills use dark text) */
	--orange-dark:#e87e00;   /* orange hover */
	--red:#781009;           /* secondary / accent */
	--red-dark:#781009;      /* deep red (footer, strong areas) */

	--ink:#23262b;           /* headings + dark text */
	--body:#4b5563;          /* body text */
	--muted:#8b9097;         /* muted text */

	--bg:#ffffff;            /* page background */
	--bg-alt:#fff5ea;        /* soft warm alt sections */
	--card:#ffffff;          /* card background */
	--line:#efe6dc;          /* light border */
	--dark:#1c1a18;          /* dark image overlay base */

	--radius:20px;
	--radius-sm:14px;
	--shadow:0 18px 40px -18px rgba(0,0,0,.20);
	--shadow-soft:0 10px 30px -12px rgba(0,0,0,.12);
	--container:1180px;
	--font-head:'Poppins',system-ui,sans-serif;
	--font-body:'Inter',system-ui,sans-serif;
}

/* ============================================================
   BASE
   ============================================================ */
*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
	margin:0;
	font-family:var(--font-body);
	color:var(--body);
	background:var(--bg);
	line-height:1.7;
	overflow-x:hidden;
}
img{max-width:100%;height:auto;display:block;}
a{color:var(--red);text-decoration:none;transition:.25s;}
a:hover{color:var(--ink);}
h1,h2,h3,h4{font-family:var(--font-head);color:var(--ink);line-height:1.2;margin:0 0 .5em;}
p{margin:0 0 1rem;}
.container{width:100%;max-width:var(--container);margin:0 auto;padding:0 22px;}
.screen-reader-text{position:absolute;left:-9999px;}
.skip-link{position:absolute;left:-9999px;}
.hide-mobile{display:inline;}

.gradient-text{color:var(--orange);-webkit-text-fill-color:var(--orange);}

/* ============================================================
   BUTTONS
   ============================================================ */
.btn{
	display:inline-flex;align-items:center;gap:.55rem;
	font-family:var(--font-head);font-weight:600;font-size:.98rem;
	padding:.85rem 1.7rem;border-radius:50px;border:none;cursor:pointer;
	transition:.3s;line-height:1;
}
.btn i{font-size:.95em;}
.btn-primary{background:var(--orange);color:var(--ink);box-shadow:0 12px 26px -12px rgba(255,157,0,.6);}
.btn-primary:hover{background:var(--red);color:#fff;transform:translateY(-3px);box-shadow:0 18px 34px -12px rgba(217,43,31,.55);}
.btn-ghost{background:transparent;color:#fff;border:1.5px solid rgba(255,255,255,.7);}
.btn-ghost:hover{background:#fff;color:var(--red);transform:translateY(-3px);}
.btn-block{display:flex;width:100%;justify-content:center;}

.link-arrow{
	display:inline-flex;align-items:center;gap:.5rem;
	font-family:var(--font-head);font-weight:600;color:var(--red);
}
.link-arrow i{transition:.25s;}
.link-arrow:hover{color:var(--ink);}
.link-arrow:hover i{transform:translateX(5px);}

/* ============================================================
   HEADER
   ============================================================ */
.site-header{position:sticky;top:0;z-index:1000;}
.topbar{background:var(--red);color:#fff;font-size:.85rem;}
.topbar-inner{display:flex;justify-content:space-between;align-items:center;min-height:42px;flex-wrap:wrap;gap:.4rem;}
.topbar a{color:#fff;}
.topbar a:hover{color:#fff;text-decoration:underline;}
.topbar .sep{opacity:.5;margin:0 .5rem;}
.topbar-meta{display:flex;align-items:center;gap:1rem;}
.topbar-social{width:26px;height:26px;display:inline-flex;align-items:center;justify-content:center;border-radius:50%;background:rgba(255,255,255,.18);font-size:.75rem;}
.topbar-social:hover{background:#fff;color:var(--red);}

.navbar{
	background:#fff;
	border-bottom:1px solid var(--line);
	transition:.3s;
}
.site-header.scrolled .navbar{box-shadow:0 8px 24px -14px rgba(0,0,0,.25);}
.navbar-inner{display:flex;align-items:center;justify-content:space-between;min-height:78px;gap:1rem;}
.brand img{height:52px;width:auto;}

.icdm-nav{list-style:none;display:flex;align-items:center;gap:.3rem;margin:0;padding:0;}
.icdm-nav>li{position:relative;}
.icdm-nav>li>a{
	display:flex;align-items:center;gap:.4rem;
	font-family:var(--font-head);font-weight:600;font-size:.96rem;
	color:var(--ink);padding:.7rem .95rem;border-radius:10px;
}
.icdm-nav>li>a:hover{color:var(--red);background:var(--bg-alt);}
.icdm-nav>li>a i{font-size:.65rem;opacity:.7;}
.icdm-nav .nav-cta a{background:var(--orange);color:var(--ink);padding:.7rem 1.4rem;box-shadow:0 10px 22px -12px rgba(255,157,0,.6);}
.icdm-nav .nav-cta a:hover{background:var(--red);color:#fff;transform:translateY(-2px);}

.sub-menu{
	list-style:none;margin:0;padding:.5rem;position:absolute;top:calc(100% + 8px);left:0;
	min-width:230px;background:#fff;border-radius:var(--radius-sm);
	box-shadow:var(--shadow-soft);border:1px solid var(--line);
	opacity:0;visibility:hidden;transform:translateY(10px);transition:.25s;
}
.icdm-nav .has-sub:hover .sub-menu{opacity:1;visibility:visible;transform:translateY(0);}
.sub-menu li a{display:block;padding:.6rem .85rem;border-radius:9px;color:var(--body);font-weight:500;font-size:.92rem;}
.sub-menu li a:hover{background:var(--bg-alt);color:var(--red);padding-left:1.1rem;}

.nav-toggle{display:none;flex-direction:column;gap:5px;background:none;border:none;cursor:pointer;padding:8px;}
.nav-toggle span{width:26px;height:3px;border-radius:3px;background:var(--orange);transition:.3s;}
.nav-toggle.open span:nth-child(1){transform:translateY(8px) rotate(45deg);}
.nav-toggle.open span:nth-child(2){opacity:0;}
.nav-toggle.open span:nth-child(3){transform:translateY(-8px) rotate(-45deg);}

/* ============================================================
   HERO
   ============================================================ */
.hero{position:relative;min-height:88vh;display:flex;align-items:center;overflow:hidden;background:var(--dark);}
.hero-slider{position:absolute;inset:0;}
.hero-slide{position:absolute;inset:0;background-size:cover;background-position:center;opacity:0;transition:opacity 1.2s ease,transform 6s ease;transform:scale(1.08);}
.hero-slide.is-active{opacity:1;transform:scale(1);}
.hero-overlay{position:absolute;inset:0;background:rgba(20,18,16,.50);}
.hero-content{position:relative;z-index:2;color:#fff;max-width:var(--container);margin-right:auto;text-align:left;padding-top:40px;padding-bottom:40px;}
.hero-content .hero-title,.hero-content .hero-sub,.hero-content .hero-badge,.hero-content .hero-actions{max-width:640px;margin-left:0;}
.hero-badge{
	display:inline-flex;align-items:center;gap:.5rem;
	background:var(--orange);border:1px solid var(--orange);
	padding:.5rem 1.1rem;border-radius:50px;
	font-size:.82rem;font-weight:600;margin-bottom:1.4rem;color:var(--ink);
}
.hero-title{font-size:clamp(1.8rem,4vw,3rem);color:#fff;font-weight:800;margin-bottom:1.1rem;letter-spacing:-.5px;}
.hero-title .gradient-text{color:var(--orange);-webkit-text-fill-color:var(--orange);}
.hero-sub{font-size:1.18rem;max-width:600px;color:rgba(255,255,255,.92);margin-bottom:2rem;}
.hero-actions{display:flex;gap:1rem;flex-wrap:wrap;}
.hero-dots{position:absolute;bottom:26px;left:0;right:0;z-index:3;display:flex;justify-content:center;gap:.6rem;}
.hero-dots button{width:11px;height:11px;border-radius:50%;border:none;background:rgba(255,255,255,.45);cursor:pointer;transition:.3s;padding:0;}
.hero-dots button.active{background:var(--orange);width:30px;border-radius:6px;}

/* ============================================================
   SECTIONS
   ============================================================ */
.section{padding:90px 0;position:relative;}
.section.alt{background:var(--bg-alt);}
.eyebrow{
	display:inline-block;font-family:var(--font-head);font-weight:700;font-size:.8rem;
	letter-spacing:2px;text-transform:uppercase;color:var(--red);margin-bottom:.7rem;
}
.eyebrow.center{display:block;text-align:center;}
.section-title{font-size:clamp(1.8rem,3.6vw,2.7rem);font-weight:700;margin-bottom:1.1rem;}
.section-title.center{text-align:center;}
.section-title.center::after{content:"";display:block;width:80px;height:5px;border-radius:5px;background:var(--orange);margin:1rem auto 0;}
.section-title.light{color:#fff;}
.lead{font-size:1.12rem;max-width:920px;}
.intro{text-align:center;}
.intro .lead{margin:0 auto 1.4rem;}

/* split layout */
.split{display:grid;grid-template-columns:1fr 1fr;gap:54px;align-items:center;}
.split-media img{border-radius:var(--radius);box-shadow:var(--shadow);}
.objective-item{display:flex;gap:1rem;margin-bottom:1.2rem;}
.objective-num{
	flex:none;width:48px;height:48px;border-radius:14px;background:var(--red);color:#fff;
	font-family:var(--font-head);font-weight:700;display:flex;align-items:center;justify-content:center;
	box-shadow:0 10px 20px -12px rgba(217,43,31,.6);
}
.objective-item p{margin:0;}

.check-list{list-style:none;margin:0 0 1rem;padding:0;}
.check-list li{display:flex;gap:.7rem;align-items:flex-start;margin-bottom:.9rem;font-size:1.05rem;color:var(--ink);font-weight:500;}
.check-list i{color:var(--red);margin-top:.25rem;}

.training-gallery{display:grid;grid-template-columns:1fr 1fr;gap:16px;}
.training-gallery img{border-radius:var(--radius-sm);box-shadow:var(--shadow-soft);aspect-ratio:4/3;object-fit:cover;width:100%;transition:.35s;}
.training-gallery img:hover{transform:translateY(-6px) scale(1.02);}

/* card */
.card{background:var(--card);border-radius:var(--radius);box-shadow:var(--shadow-soft);border:1px solid var(--line);}

/* appeal */
.appeal-grid{display:grid;grid-template-columns:1.6fr 1fr;gap:30px;margin-top:2.4rem;}
.appeal-main{padding:24px;}
.appeal-slider{position:relative;border-radius:var(--radius-sm);overflow:hidden;aspect-ratio:16/9;margin-bottom:1.4rem;}
.appeal-slide{position:absolute;inset:0;opacity:0;transition:opacity .8s;}
.appeal-slide.is-active{opacity:1;position:relative;}
.appeal-slide img{width:100%;height:100%;object-fit:cover;}
.appeal-side{padding:24px;align-self:start;}
.card-title{font-size:1.3rem;text-align:center;padding-bottom:.8rem;border-bottom:2px solid var(--line);margin-bottom:1rem;}
.uphold-list{list-style:none;margin:0 0 1.4rem;padding:0;}
.uphold-list li{display:flex;justify-content:space-between;gap:1rem;padding:.7rem 0;border-bottom:1px dashed var(--line);font-size:.95rem;}
.uphold-list li b{color:var(--red);white-space:nowrap;}

/* pillars */
.pillar-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:26px;margin-top:2.6rem;}
.pillar{padding:34px 28px;transition:.35s;}
.pillar:hover{transform:translateY(-8px);box-shadow:var(--shadow);}
.pillar-icon{width:64px;height:64px;border-radius:18px;display:flex;align-items:center;justify-content:center;font-size:1.6rem;color:#fff;margin-bottom:1.2rem;background:var(--red);}
.grad-1,.grad-3{background:var(--red);}
.grad-2{background:var(--orange);color:var(--ink);}
.pillar h3{font-size:1.3rem;margin-bottom:1rem;}
.pillar ul{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:.5rem;}
.pillar ul li{background:var(--bg-alt);color:var(--ink);font-size:.84rem;font-weight:500;padding:.4rem .8rem;border-radius:50px;}

/* what we do */
.whatwedo{background-size:cover;background-position:center;background-attachment:fixed;}
.whatwedo-overlay{position:absolute;inset:0;background:rgba(201,35,25,.86);}
.whatwedo .container{position:relative;z-index:2;}
.stat-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:24px;margin-top:2.6rem;}
.stat{text-align:center;color:#fff;padding:24px;border-radius:var(--radius);background:rgba(255,255,255,.10);border:1px solid rgba(255,255,255,.22);transition:.35s;}
.stat:hover{background:rgba(255,255,255,.18);border-color:#fff;transform:translateY(-6px);}
.stat-num{font-family:var(--font-head);font-weight:800;font-size:3.6rem;line-height:1;color:#fff;display:block;margin-bottom:.6rem;}
.stat h3{color:#fff;font-size:1.05rem;}

/* partners marquee */
.partners{padding-bottom:90px;}
.marquee{overflow:hidden;margin-top:2.4rem;}
.marquee-track{display:flex;gap:30px;width:max-content;animation:scroll 32s linear infinite;}
.marquee:hover .marquee-track{animation-play-state:paused;}
.marquee-item{flex:none;width:160px;height:100px;background:#fff;border-radius:var(--radius-sm);border:1px solid var(--line);box-shadow:var(--shadow-soft);display:flex;align-items:center;justify-content:center;padding:18px;}
.marquee-item img{max-height:62px;width:auto;object-fit:contain;filter:grayscale(1);opacity:.7;transition:.3s;}
.marquee-item:hover img{filter:none;opacity:1;}
@keyframes scroll{to{transform:translateX(-50%);}}

/* ============================================================
   PAGE / CONTENT
   ============================================================ */
.page-hero{position:relative;padding:96px 0 76px;background:var(--red);background-size:cover;background-position:center;background-repeat:no-repeat;overflow:hidden;}
.page-hero.has-bg{background-color:var(--red-dark);}
.page-hero-overlay{position:absolute;inset:0;background:rgba(120,16,9,.68);}
.page-hero .container{position:relative;z-index:2;}
.page-hero-title{color:#fff;font-size:clamp(2rem,4vw,3rem);font-weight:800;}
.page-hero-meta{color:rgba(255,255,255,.92);}
.breadcrumb{color:rgba(255,255,255,.9);font-size:.9rem;margin-bottom:.5rem;}
.breadcrumb a{color:#fff;text-decoration:underline;}

.content-wrap{padding:64px 22px;}
.entry-content{max-width:920px;margin:0 auto;font-size:1.06rem;}
.entry-content img{border-radius:var(--radius-sm);box-shadow:var(--shadow-soft);height:auto;margin:1.4rem auto;}
.entry-content h1,.entry-content h2,.entry-content h3{margin-top:1.6rem;}
.entry-content h2{font-size:1.8rem;}
.entry-content a{font-weight:600;text-decoration:underline;}
.entry-content ul,.entry-content ol{padding-left:1.3rem;}
.entry-content li{margin-bottom:.5rem;}
.entry-content table{width:100%;border-collapse:collapse;margin:1.4rem 0;border-radius:var(--radius-sm);overflow:hidden;box-shadow:var(--shadow-soft);}
.entry-content th{background:var(--red);color:#fff;padding:.85rem 1rem;text-align:left;}
.entry-content td{padding:.8rem 1rem;border-bottom:1px solid var(--line);}
.entry-content blockquote{border-left:5px solid var(--orange);background:var(--bg-alt);padding:1rem 1.4rem;border-radius:0 var(--radius-sm) var(--radius-sm) 0;margin:1.4rem 0;}
.post-thumb img{width:100%;}

.post-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:30px;}
.post-card{overflow:hidden;transition:.35s;}
.post-card:hover{transform:translateY(-8px);box-shadow:var(--shadow);}
.post-card-thumb img{width:100%;aspect-ratio:16/10;object-fit:cover;}
.post-card-body{padding:24px;}
.post-card-title{font-size:1.25rem;margin-bottom:.4rem;}
.post-card-title a{color:var(--ink);}
.post-card-title a:hover{color:var(--red);}
.post-card-meta{color:var(--muted);font-size:.85rem;margin-bottom:.8rem;}
.pagination{margin-top:3rem;text-align:center;}
.pagination .page-numbers{display:inline-flex;width:42px;height:42px;align-items:center;justify-content:center;border-radius:12px;margin:0 4px;background:#fff;border:1px solid var(--line);color:var(--ink);font-weight:600;}
.pagination .page-numbers.current,.pagination a.page-numbers:hover{background:var(--red);color:#fff;border-color:var(--red);}

/* ============================================================
   FOOTER
   ============================================================ */
.site-footer{position:relative;background:var(--red-dark);color:rgba(255,255,255,.82);overflow:hidden;}
.footer-glow{display:none;}
.footer-grid{position:relative;z-index:2;display:grid;grid-template-columns:1.6fr 1fr 1fr 1.3fr;gap:40px;padding:70px 22px 50px;}
.footer-logo{height:54px;margin-bottom:1rem;}
.footer-title{color:#fff;font-size:1.15rem;margin-bottom:1rem;position:relative;padding-bottom:.6rem;}
.footer-title::after{content:"";position:absolute;left:0;bottom:0;width:42px;height:3px;border-radius:3px;background:var(--orange);}
.footer-col p{color:rgba(255,255,255,.74);font-size:.95rem;}
.footer-readmore{color:#fff;font-weight:600;display:inline-flex;gap:.5rem;align-items:center;}
.footer-readmore:hover{color:var(--orange);}
.footer-links,.footer-contact{list-style:none;margin:0;padding:0;}
.footer-links li{margin-bottom:.6rem;}
.footer-links a{color:rgba(255,255,255,.76);font-size:.95rem;}
.footer-links a:hover{color:var(--orange);padding-left:6px;}
.footer-contact li{display:flex;gap:.7rem;margin-bottom:1rem;font-size:.92rem;color:rgba(255,255,255,.76);}
.footer-contact i{color:var(--orange);margin-top:.3rem;}
.footer-contact a{color:rgba(255,255,255,.76);}
.footer-contact a:hover{color:var(--orange);}
.footer-bar{position:relative;z-index:2;border-top:1px solid rgba(255,255,255,.14);}
.footer-bar-inner{display:flex;justify-content:space-between;gap:1rem;flex-wrap:wrap;padding:20px 22px;font-size:.88rem;color:rgba(255,255,255,.66);}
.footer-bar a{color:var(--orange);}

.back-to-top{position:fixed;bottom:26px;right:26px;width:48px;height:48px;border-radius:50%;border:none;background:var(--orange);color:var(--ink);cursor:pointer;box-shadow:var(--shadow);opacity:0;visibility:hidden;transform:translateY(20px);transition:.35s;z-index:900;font-size:1rem;}
.back-to-top:hover{background:var(--red);color:#fff;}
.back-to-top.show{opacity:1;visibility:visible;transform:translateY(0);}

/* ============================================================
   REVEAL ANIMATION
   ============================================================ */
.reveal{opacity:0;transform:translateY(34px);transition:opacity .7s ease,transform .7s ease;}
.reveal.in{opacity:1;transform:none;}

/* ============================================================
   RESPONSIVE
   ============================================================ */
@media(max-width:980px){
	.split{grid-template-columns:1fr;gap:34px;}
	.appeal-grid{grid-template-columns:1fr;}
	.pillar-grid{grid-template-columns:1fr;}
	.stat-grid{grid-template-columns:1fr 1fr;}
	.footer-grid{grid-template-columns:1fr 1fr;}
}
@media(max-width:991px){
	.hide-mobile{display:none;}
	.nav-toggle{display:flex;}
	.site-nav{
		position:fixed;top:0;right:-100%;width:min(82vw,340px);height:100vh;
		background:#fff;box-shadow:-12px 0 40px -10px rgba(0,0,0,.25);
		padding:90px 24px 30px;overflow-y:auto;transition:right .35s ease;z-index:1100;
	}
	.site-nav.open{right:0;}
	.icdm-nav{flex-direction:column;align-items:stretch;gap:.2rem;}
	.icdm-nav>li>a{padding:.85rem .6rem;border-radius:10px;justify-content:space-between;}
	.sub-menu{position:static;opacity:1;visibility:visible;transform:none;box-shadow:none;border:none;padding:.2rem 0 .2rem 1rem;min-width:0;display:none;}
	.icdm-nav .has-sub.open .sub-menu{display:block;}
	.icdm-nav .nav-cta a{justify-content:center;margin-top:.6rem;}
	body.nav-open{overflow:hidden;}
	.nav-backdrop{position:fixed;inset:0;background:rgba(28,20,18,.5);opacity:0;visibility:hidden;transition:.35s;z-index:998;}
	.nav-backdrop.show{opacity:1;visibility:visible;}
}
@media(max-width:768px){
	.page-hero{padding:64px 0 52px;}
	.content-wrap{padding:44px 18px;}
	.hero-content{padding-top:24px;padding-bottom:24px;}
	.hero-title{letter-spacing:0;}
}
@media(max-width:560px){
	.section{padding:56px 0;}
	.stat-grid{grid-template-columns:1fr;}
	.training-gallery{grid-template-columns:1fr 1fr;}
	.footer-grid{grid-template-columns:1fr;}
	.hero{min-height:78vh;}
	.whatwedo{background-attachment:scroll;}
	.page-hero{padding:52px 0 42px;}
	.content-wrap{padding:36px 16px;}
	.topbar-inner{justify-content:center;}
	.footer-bar-inner{justify-content:center;text-align:center;}
	.hero-actions .btn{flex:1 1 auto;justify-content:center;}
	/* Wide content tables scroll instead of overflowing */
	.entry-content table{display:block;overflow-x:auto;white-space:nowrap;-webkit-overflow-scrolling:touch;}
}
@media(max-width:400px){
	.container{padding:0 14px;}
	.brand img{height:44px;}
	.gallery-grid{grid-template-columns:1fr 1fr;}
}