/* ==========================================================================
   Impact Stories — front-end styles
   Everything is scoped to .is-root so the plugin never touches the theme,
   and typical theme / Elementor rules can never leak in.
   ========================================================================== */

.is-root{
	/* palette */
	--ink:#14201f;--muted:#5d6b6a;--teal:#0f5257;--teal-d:#0a3a3d;
	--saffron:#f2a93b;--mist:#eaf1f0;--line:#d9e3e1;--bg:#f6f8f7;--white:#fff;
	/* type */
	--font-head:'Bricolage Grotesque','Hind Siliguri',system-ui,sans-serif;
	--font-body:'Hind Siliguri',system-ui,-apple-system,'Segoe UI',sans-serif;
	--fs:17px;
	/* shape + rhythm */
	--r:14px;--r-sm:10px;--r-pill:99px;
	--maxw:1120px;--pad:22px;
	--shadow:0 1px 2px rgba(20,32,31,.04),0 8px 24px rgba(20,32,31,.06);
	--shadow-sm:0 1px 2px rgba(20,32,31,.05);
	--tap:44px;

	font-family:var(--font-body);
	color:var(--ink);
	line-height:1.6;
	font-size:var(--fs);
	background:var(--bg);
	-webkit-font-smoothing:antialiased;
	text-rendering:optimizeLegibility;
}

/* --------------------------------------------------------------------------
   Scoped reset — neutralise what themes and Elementor commonly force.
   !important is used ONLY in the button/input reset below, nowhere else.
   -------------------------------------------------------------------------- */
.is-root *,.is-root *::before,.is-root *::after{box-sizing:border-box}
.is-root p,.is-root ul,.is-root ol,.is-root figure,.is-root blockquote{margin:0;padding:0}

.is-root h1,.is-root h2,.is-root h3,.is-root h4{
	font-family:var(--font-head);
	line-height:1.15;
	letter-spacing:-.01em;
	margin:0;
	padding:0;
	color:inherit;
	text-transform:none;
	font-weight:700;
}

.is-root a{
	color:var(--teal);
	text-decoration:none;
	transition:color .18s ease;
}
.is-root a:hover{color:var(--teal-d)}

.is-root img{
	display:block;
	max-width:100%;
	width:100%;
	height:100%;
	object-fit:cover;
	margin:0;
	border:0;
	border-radius:0;
}

.is-root ul,.is-root ol{list-style:none}

/* Form controls + buttons: this is the only block allowed to use !important,
   and only for the handful of properties themes / Elementor kits force. */
.is-root button,
.is-root input,
.is-root select,
.is-root textarea{
	font:inherit;
	color:inherit;
	margin:0;
	letter-spacing:normal !important;
	text-transform:none !important;
}
.is-root button{
	cursor:pointer;
	background:transparent !important;
	color:inherit;
	border:0 !important;
	border-radius:0 !important;
	padding:0 !important;
	box-shadow:none !important;
	min-height:0;
	line-height:1.4;
}
.is-root input,
.is-root select,
.is-root textarea{
	background:var(--white) !important;
	color:var(--ink);
	border:1px solid var(--line) !important;
	border-radius:var(--r-sm) !important;
	box-shadow:none !important;
	min-height:0;
}

.is-root :focus-visible{outline:3px solid var(--saffron);outline-offset:2px}

.is-wrap{max-width:var(--maxw);margin:0 auto;padding:0 var(--pad)}
.is-i{width:17px;height:17px;stroke:currentColor;fill:none;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;flex:none}

/* --------------------------------------------------------------------------
   Button system — every clickable control uses these, never the theme's.
   -------------------------------------------------------------------------- */
.is-btn{
	display:inline-flex;align-items:center;justify-content:center;gap:8px;
	min-height:var(--tap);
	padding:10px 20px !important;
	border-radius:var(--r-pill) !important;
	font-weight:600;font-size:15px;
	border:1px solid transparent !important;
	background:var(--white) !important;color:var(--ink) !important;
	text-decoration:none;cursor:pointer;
	transition:background .18s ease,border-color .18s ease,color .18s ease,transform .08s ease,box-shadow .18s ease;
}
.is-btn:active{transform:translateY(1px)}
.is-btn-ghost{background:var(--white) !important;border-color:var(--line) !important;color:var(--ink) !important}
.is-btn-ghost:hover{border-color:var(--teal) !important;color:var(--teal) !important}
.is-btn-primary{background:var(--teal) !important;border-color:var(--teal) !important;color:var(--white) !important}
.is-btn-primary:hover{background:var(--teal-d) !important;border-color:var(--teal-d) !important;color:var(--white) !important}

/* --------------------------------------------------------------------------
   Intro / opening section
   -------------------------------------------------------------------------- */
.is-intro{padding-top:72px;padding-bottom:60px;display:grid;grid-template-columns:1.05fr 1fr;gap:56px;align-items:center}
.is-intro h1{font-size:clamp(34px,5vw,56px);color:var(--teal-d);max-width:14ch;font-weight:800}
.is-lead{margin:20px 0 0;color:#34413f;max-width:52ch;font-size:18px}
.is-lead2{margin-top:12px;color:var(--muted);font-size:16px}
.is-numbers{display:flex;gap:16px;margin:30px 0;flex-wrap:wrap}
.is-numbers>div{flex:1 1 150px;background:var(--white);border:1px solid var(--line);border-radius:var(--r);padding:16px 18px;box-shadow:var(--shadow-sm)}
.is-numbers b{display:block;font-family:var(--font-head);font-size:30px;color:var(--teal);line-height:1.15;font-weight:800}
.is-numbers span{font-size:14px;color:var(--muted)}

.is-shr{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.is-shr em{font-style:normal;color:var(--muted);font-size:15px;margin-right:4px}
.is-sb{
	display:inline-flex;align-items:center;gap:8px;min-height:var(--tap);
	border:1px solid var(--line) !important;background:var(--white) !important;
	border-radius:var(--r-pill) !important;padding:8px 18px !important;
	font-size:15px;font-weight:500;text-decoration:none;color:var(--ink) !important;
	transition:border-color .18s ease,color .18s ease,box-shadow .18s ease;
}
.is-sb:hover{border-color:var(--teal) !important;color:var(--teal) !important;box-shadow:var(--shadow-sm)}

.is-donate{
	display:inline-flex;justify-content:center;align-items:center;gap:8px;min-height:var(--tap);
	background:var(--saffron) !important;color:var(--ink) !important;
	border:1px solid var(--saffron) !important;border-radius:var(--r-pill) !important;
	padding:12px 26px !important;font-weight:600;text-decoration:none;margin-top:20px;
	box-shadow:var(--shadow-sm);transition:filter .18s ease,transform .08s ease;
}
.is-donate:hover{filter:brightness(.96);color:var(--ink) !important}
.is-donate:active{transform:translateY(1px)}
.is-side .is-donate{margin-top:0;width:100%}

.is-collage{display:grid;grid-template-columns:1.3fr 1fr;grid-template-rows:200px 200px;gap:12px}
.is-collage div{border-radius:var(--r);overflow:hidden;background:var(--mist);box-shadow:var(--shadow-sm)}
.is-collage div:first-child{grid-row:span 2}

/* --------------------------------------------------------------------------
   Stories header + filters
   -------------------------------------------------------------------------- */
.is-stories{background:var(--white);border-top:1px solid var(--line);padding:52px 0 84px}
.is-sh h1,.is-sh h2{font-size:clamp(26px,3.4vw,36px);color:var(--teal-d);font-weight:800}
.is-count{margin:6px 0 0;color:var(--muted);font-size:15px}
.is-termdesc{margin-top:8px;color:var(--muted);max-width:60ch}
.is-crumb{font-size:14px;color:var(--muted);padding:20px 0 10px}
.is-crumb a{color:var(--teal)}

.is-filters{display:flex;justify-content:space-between;align-items:center;gap:14px 24px;flex-wrap:wrap;padding:18px 0;border-bottom:1px solid var(--line)}
.is-tabs{display:flex;gap:8px 22px;flex-wrap:wrap}
.is-tabs a{padding:8px 0;color:var(--muted);border-bottom:2px solid transparent;font-weight:500;text-decoration:none;transition:color .18s ease,border-color .18s ease}
.is-tabs a:hover{color:var(--teal)}
.is-tabs a.on{color:var(--teal-d);border-color:var(--saffron);font-weight:600}

.is-dates{display:flex;gap:10px;align-items:center;flex-wrap:wrap;margin:0}
.is-sel{display:flex;align-items:center;gap:8px;border:1px solid var(--line);border-radius:var(--r-pill);padding:0 14px;height:var(--tap);background:var(--white);margin:0}
.is-sel select,.is-sel input{border:0 !important;outline:0;background:transparent !important;height:calc(var(--tap) - 2px);font-size:15px;padding:0 !important;box-shadow:none !important;border-radius:0 !important}
.is-range{display:none;gap:8px;align-items:center}
.is-range.on{display:flex;flex-wrap:wrap}
.is-link{background:transparent !important;color:var(--teal) !important;font-weight:600;font-size:15px;text-decoration:none;padding:8px 4px !important;min-height:var(--tap);display:inline-flex;align-items:center}
.is-link:hover{color:var(--teal-d) !important}

/* --------------------------------------------------------------------------
   Timeline
   -------------------------------------------------------------------------- */
.is-mh{display:flex;justify-content:space-between;align-items:baseline;gap:10px;margin:44px 0 24px}
.is-mh h3{font-size:22px;color:var(--teal-d);font-weight:700}
.is-mh span{color:var(--muted);font-size:15px}

/* Timeline geometry: the vertical line and the pin node share one anchor
   so they always line up. The node sits in the middle of the 28px pin column:
   84px (date) + 10px (gap) + 14px (half of 28px) = 108px from the entry's left. */
.is-tl{position:relative}
.is-tl::before{content:"";position:absolute;left:108px;top:8px;bottom:8px;width:2px;background:var(--line);transform:translateX(-1px)}
.is-ent{position:relative;display:grid;grid-template-columns:84px 28px 1fr;gap:0 10px;margin-bottom:38px}
.is-ent:last-child{margin-bottom:0}
.is-when{text-align:right;padding-top:2px}
.is-when b{display:block;font-family:var(--font-head);font-size:34px;line-height:1;color:var(--teal-d);font-weight:800}
.is-when span{font-size:14px;color:var(--muted)}
.is-pin{position:relative}
.is-pin::after{content:"";position:absolute;left:50%;top:9px;width:14px;height:14px;border-radius:50%;background:var(--saffron);border:3px solid var(--white);box-shadow:0 0 0 2px var(--saffron);transform:translateX(-50%)}

.is-story{display:grid;grid-template-columns:1.1fr 1fr;gap:28px;align-items:center}
.is-pic{position:relative;border-radius:var(--r);overflow:hidden;aspect-ratio:4/3;display:block;background:var(--mist);box-shadow:var(--shadow-sm)}
.is-pic img{transition:transform .35s ease}
.is-pic:hover img{transform:scale(1.03)}
.is-n{position:absolute;right:12px;bottom:12px;background:rgba(0,0,0,.72);color:#fff;border-radius:var(--r-pill);padding:4px 11px;font-size:13px;display:flex;gap:6px;align-items:center;backdrop-filter:saturate(1.2) blur(2px)}
.is-tg{color:var(--teal);font-weight:600;font-size:15px}
.is-txt h3{font-size:clamp(22px,2.6vw,28px);margin:6px 0 10px;font-weight:700}
.is-txt h3 a{color:var(--ink)}
.is-txt h3 a:hover{color:var(--teal)}
.is-txt p{margin:0;color:#3a4846;max-width:46ch}
.is-amt{margin:18px 0;display:flex;align-items:baseline;gap:12px;flex-wrap:wrap}
.is-amt b{font-family:var(--font-head);font-size:30px;color:var(--teal);font-weight:800}
.is-amt span{color:var(--muted);font-size:15px}
.is-acts{display:flex;gap:18px;align-items:center;margin-top:14px;flex-wrap:wrap}
.is-acts a:first-child{color:var(--teal-d);font-weight:600;text-decoration:none;display:inline-flex;gap:8px;align-items:center;border-bottom:2px solid var(--saffron);padding-bottom:1px;min-height:var(--tap)}
.is-acts a:first-child:hover{color:var(--teal)}
.is-share{color:var(--muted) !important;display:inline-flex;gap:6px;align-items:center;font-size:15px;font-weight:500;text-decoration:none;min-height:var(--tap)}
.is-share:hover{color:var(--teal) !important}

.is-empty{padding:72px 10px;text-align:center;color:var(--muted)}
.is-empty b{display:block;color:var(--ink);font-size:20px;margin-bottom:6px;font-family:var(--font-head);font-weight:700}

/* pagination */
.is-pager{margin-top:28px}
.is-pager .nav-links{display:flex;gap:8px;justify-content:center;flex-wrap:wrap}
.is-pager .page-numbers{display:inline-flex;align-items:center;justify-content:center;min-width:var(--tap);min-height:var(--tap);border:1px solid var(--line);border-radius:var(--r-pill);padding:6px 16px;text-decoration:none;background:var(--white);color:var(--teal);transition:border-color .18s ease,color .18s ease,background .18s ease}
.is-pager a.page-numbers:hover{border-color:var(--teal);color:var(--teal-d)}
.is-pager .current{background:var(--teal);color:#fff;border-color:var(--teal)}

/* --------------------------------------------------------------------------
   Cards (shortcode grid / related)
   -------------------------------------------------------------------------- */
.is-grid{display:grid;gap:22px}
.is-cols-1{grid-template-columns:1fr}
.is-cols-2{grid-template-columns:repeat(2,1fr)}
.is-cols-3{grid-template-columns:repeat(3,1fr)}
.is-cols-4{grid-template-columns:repeat(4,1fr)}
.is-card{background:var(--white);border:1px solid var(--line);border-radius:var(--r);overflow:hidden;display:flex;flex-direction:column;box-shadow:var(--shadow-sm);transition:box-shadow .2s ease,transform .2s ease,border-color .2s ease}
.is-card:hover{box-shadow:var(--shadow);transform:translateY(-2px);border-color:var(--mist)}
.is-card-img{display:block;aspect-ratio:4/3;background:var(--mist);overflow:hidden}
.is-card-img img{transition:transform .35s ease}
.is-card:hover .is-card-img img{transform:scale(1.04)}
.is-card-body{padding:16px 18px 18px;display:flex;flex-direction:column;gap:8px;flex:1}
.is-card h3{font-size:20px;font-weight:700}
.is-card h3 a{color:var(--ink)}
.is-card h3 a:hover{color:var(--teal)}
.is-card-facts{margin-top:auto;padding-top:12px;border-top:1px solid var(--line);display:flex;justify-content:space-between;gap:10px;font-size:14px;color:var(--muted)}
.is-card-facts span{display:inline-flex;gap:6px;align-items:center}
.is-card-facts b{color:var(--teal-d);font-size:16px;font-family:var(--font-head);font-weight:700}

/* --------------------------------------------------------------------------
   Single story
   -------------------------------------------------------------------------- */
.is-single{padding-bottom:64px}
.is-story-head{max-width:820px}
.is-tag{display:inline-block;background:var(--mist);color:var(--teal);font-size:14px;font-weight:600;padding:4px 14px;border-radius:var(--r-pill)}
.is-story-head h1{font-size:clamp(30px,4.5vw,48px);margin:12px 0;color:var(--teal-d);font-weight:800}
.is-facts{display:flex;gap:18px;flex-wrap:wrap;color:var(--muted);font-size:15px}
.is-facts span{display:inline-flex;gap:6px;align-items:center}
.is-cover{height:min(520px,60vw);border-radius:var(--r);overflow:hidden;margin:24px 0;background:var(--mist);box-shadow:var(--shadow-sm)}
.is-layout{display:grid;grid-template-columns:1fr 320px;gap:44px;align-items:start}
.is-body>p,.is-body li{max-width:64ch}
.is-body p{margin:0 0 18px;color:#2c3a38}
.is-body h2{font-size:26px;margin:32px 0 12px;color:var(--teal-d);font-weight:700}
.is-body ul,.is-body ol{margin:0 0 18px;padding-left:22px}
.is-body ul li{list-style:disc}
.is-body ol li{list-style:decimal}
.is-body li{margin:0 0 8px}
.is-body a{text-decoration:underline;text-underline-offset:2px}
.is-body blockquote{border-left:4px solid var(--saffron);padding:6px 0 6px 20px;margin:26px 0;font-family:var(--font-head);font-size:22px;line-height:1.4;color:var(--teal-d);max-width:34ch}
.is-closing{display:flex;gap:16px;align-items:flex-start;margin:32px 0 0;padding:20px 22px;background:var(--mist);border:1px solid var(--line);border-left:4px solid var(--saffron);border-radius:var(--r)}
.is-closing-ic{flex:none;display:grid;place-items:center;width:40px;height:40px;border-radius:50%;background:var(--white);color:var(--saffron);box-shadow:var(--shadow-sm)}
.is-closing-ic .is-i{width:20px;height:20px}
.is-closing b{display:block;font-family:var(--font-head);font-weight:700;font-size:16px;color:var(--teal-d);margin-bottom:4px}
.is-closing p{margin:0;color:#3a4846;font-size:16px;line-height:1.55;max-width:none}

.is-gal{display:grid;grid-template-columns:repeat(6,1fr);grid-auto-rows:120px;gap:10px;margin:20px 0 28px}
.is-gal-i{border:0 !important;padding:0 !important;border-radius:var(--r-sm) !important;overflow:hidden;grid-column:span 2;background:var(--mist) !important;box-shadow:var(--shadow-sm)}
.is-gal-i:first-child{grid-column:span 4;grid-row:span 2}
.is-gal-i img{transition:transform .35s ease}
.is-gal-i:hover img{transform:scale(1.04)}

.is-side{position:sticky;top:20px;display:flex;flex-direction:column;gap:18px}
.is-panel{background:var(--white);border:1px solid var(--line);border-radius:var(--r);padding:22px;box-shadow:var(--shadow-sm)}
.is-panel h3{font-size:18px;margin-bottom:14px;font-weight:700}
.is-row{display:flex;justify-content:space-between;gap:12px;padding:10px 0;border-bottom:1px solid var(--line);font-size:15px}
.is-row:last-child{border:0;padding-bottom:0}
.is-row span{color:var(--muted)}
.is-row b{text-align:right;font-weight:600}
.is-row a{text-decoration:none;color:var(--teal)}
.is-amount{background:var(--teal);color:#fff;text-align:center;border-color:var(--teal)}
.is-amount small{opacity:.85;font-size:14px}
.is-amount b{font-family:var(--font-head);font-size:38px;color:var(--saffron);display:block;line-height:1.1;margin-top:4px;font-weight:800}
.is-panel .is-shr{gap:8px;flex-direction:column;align-items:stretch}
.is-panel .is-shr .is-sb{justify-content:center}

.is-nav{display:flex;justify-content:space-between;gap:16px;margin:40px 0 0;padding-top:24px;border-top:1px solid var(--line)}
.is-nav a{color:var(--teal);font-weight:600;text-decoration:none;display:inline-flex;align-items:center;min-height:var(--tap)}
.is-nav a:hover{color:var(--teal-d)}
.is-rel{margin-top:56px}
.is-rel h2{font-size:28px;margin-bottom:22px;color:var(--teal-d);font-weight:700}

/* --------------------------------------------------------------------------
   Lightbox — the .is-lb element is created on <body> and carries .is-root.
   -------------------------------------------------------------------------- */
.is-root.is-lb{position:fixed;inset:0;background:rgba(10,15,15,.9);display:none;align-items:center;justify-content:center;z-index:99999;padding:20px}
.is-root.is-lb.on{display:flex}
.is-root.is-lb img{max-width:min(1000px,92vw);max-height:86vh;width:auto;height:auto;border-radius:var(--r-sm);box-shadow:0 20px 60px rgba(0,0,0,.4)}
.is-root.is-lb button{position:absolute;background:#fff !important;color:#14201f !important;border:0 !important;border-radius:var(--r-pill) !important;width:44px;height:44px;min-height:44px;font-size:26px;line-height:1;display:grid;place-items:center;cursor:pointer;box-shadow:0 2px 10px rgba(0,0,0,.25);padding:0 !important}
.is-root.is-lb button:hover{background:var(--mist) !important}
.is-lb-x{top:16px;right:20px}
.is-lb-p{left:16px;top:50%;transform:translateY(-50%)}
.is-lb-n{right:16px;top:50%;transform:translateY(-50%)}

/* --------------------------------------------------------------------------
   Quick-post form
   -------------------------------------------------------------------------- */
.is-formbox{max-width:680px;margin:20px auto;background:var(--white);border:1px solid var(--line);border-radius:var(--r);padding:28px;display:flex;flex-direction:column;gap:16px;box-shadow:var(--shadow-sm)}
.is-formbox h3{font-size:24px;font-weight:700}
.is-formbox label{display:flex;flex-direction:column;gap:6px;font-weight:500;font-size:15px}
.is-formbox input[type=text],
.is-formbox input[type=number],
.is-formbox input[type=date],
.is-formbox input[type=file],
.is-formbox select,
.is-formbox textarea{
	border:1px solid var(--line) !important;border-radius:var(--r-sm) !important;
	padding:11px 13px !important;background:var(--white) !important;width:100%;
	font-weight:400;min-height:var(--tap);
}
.is-formbox textarea{min-height:120px;line-height:1.5}
.is-formbox input:focus,.is-formbox select:focus,.is-formbox textarea:focus{border-color:var(--teal) !important}
.is-row2{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.is-check{flex-direction:row;align-items:flex-start;gap:10px;font-weight:400}
.is-check input{min-height:0;margin-top:3px}
.is-previews{display:flex;gap:8px;flex-wrap:wrap}
.is-previews img{width:72px;height:72px;border-radius:var(--r-sm);box-shadow:var(--shadow-sm)}
.is-note{padding:11px 15px;border-radius:var(--r-sm);font-size:15px}
.is-note.ok{background:#e4f4ea;color:#14532d}
.is-note.err{background:#fde8e6;color:#8a1c14}
.is-formbox .is-donate{margin-top:6px;width:100%}

/* --------------------------------------------------------------------------
   Responsive
   -------------------------------------------------------------------------- */
@media(max-width:900px){
	.is-intro{grid-template-columns:1fr;gap:34px;padding-top:44px}
	.is-story{grid-template-columns:1fr}
	.is-layout{grid-template-columns:1fr}
	.is-side{position:static}
	.is-cols-3,.is-cols-4{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:620px){
	.is-stories{padding:40px 0 64px}
	.is-filters{gap:14px 0}
	.is-dates{width:100%;gap:8px}
	/* Line and node share the center of the 16px pin column (8px). */
	.is-tl::before{left:8px}
	.is-ent{grid-template-columns:16px 1fr;gap:0 14px}
	.is-when{grid-column:2;text-align:left;display:flex;gap:8px;align-items:baseline;order:1;margin-bottom:10px}
	.is-when b{font-size:26px}
	.is-pin{grid-column:1;grid-row:1}
	.is-pin::after{left:50%;top:6px;transform:translateX(-50%)}
	.is-story{grid-column:2;order:2}
	.is-numbers{gap:12px}
	.is-numbers>div{flex:1 1 calc(50% - 6px)}
	.is-collage{grid-template-rows:150px 150px}
	.is-cols-2,.is-cols-3,.is-cols-4{grid-template-columns:1fr}
	.is-row2{grid-template-columns:1fr}
	.is-gal{grid-template-columns:repeat(2,1fr);grid-auto-rows:120px}
	.is-gal-i,.is-gal-i:first-child{grid-column:span 1;grid-row:auto}
	.is-nav{flex-direction:column;gap:8px}
}
@media(max-width:380px){
	.is-wrap{padding:0 16px}
	.is-numbers>div{flex:1 1 100%}
}

@media(prefers-reduced-motion:reduce){
	.is-root *,.is-root *::before,.is-root *::after{transition:none !important;animation:none !important}
	.is-pic:hover img,.is-card:hover .is-card-img img,.is-gal-i:hover img{transform:none}
}