/* =========================================================
   PRAGITHA — Enhancement Layer
   Fluid ratios, refined spacing, hover polish and scroll
   animations layered on top of pragitha.css. Nothing here
   removes existing rules — it refines and extends them.
   ========================================================= */

:root{
	--ease-out: cubic-bezier(.16,1,.3,1);
	--ease-soft: cubic-bezier(.4,0,.2,1);
	--section-pad: clamp(56px, 8vw, 112px);
	--gap-lg: clamp(24px, 4vw, 56px);
}

html{ scroll-behavior:smooth; }

@media (prefers-reduced-motion: reduce){
	html{ scroll-behavior:auto; }
	*, *::before, *::after{ animation-duration:.001ms !important; animation-iteration-count:1 !important; transition-duration:.001ms !important; scroll-behavior:auto !important; }
}

/* ---------- Fluid type & rhythm ---------- */
.hero-slide-content h1{ font-size:clamp(28px, 4.6vw, 58px); letter-spacing:.01em; }
.hero-slide-sub{ font-size:clamp(12px, 1.1vw, 16px); }
.section-head h2{ font-size:clamp(24px, 3vw, 34px); }
.intro-copy h2{ font-size:clamp(22px, 2.6vw, 31px); }
.page-hero h1{ font-size:clamp(28px, 4vw, 40px); }
.footer-cta-inner h2{ font-size:clamp(20px, 2.4vw, 25px); }

.section{ padding:var(--section-pad) 0; }
.section-head{ margin-bottom:clamp(32px, 5vw, 48px); }
.intro-grid{ gap:var(--gap-lg); }
.grid{ gap:clamp(18px, 2.4vw, 28px); }

/* ---------- Header: depth on scroll, no layout jump ---------- */
.site-header{
	transition:box-shadow .35s var(--ease-soft), background-color .35s var(--ease-soft), padding .3s var(--ease-soft);
}
.site-header.is-sticky{
	background:rgba(255,255,255,.92);
	backdrop-filter:blur(10px);
	-webkit-backdrop-filter:blur(10px);
	box-shadow:0 8px 30px rgba(18,54,38,.10);
}
.site-header.is-sticky .site-header-main{ padding-top:10px; padding-bottom:10px; }
.primary-menu li a{ transition:color .25s var(--ease-soft); }
.btn{ transition:transform .25s var(--ease-out), box-shadow .25s var(--ease-out), background-color .25s var(--ease-soft), color .25s var(--ease-soft); }
.btn:hover{ transform:translateY(-2px); box-shadow:0 10px 24px rgba(18,54,38,.18); }
.btn:active{ transform:translateY(0); }
.header-cta:hover{ transform:translateY(-1px); }
.link-arrow{ transition:color .2s ease, border-color .25s var(--ease-soft), padding-right .25s var(--ease-soft); display:inline-flex; align-items:center; }
.link-arrow:hover{ padding-right:6px; }

/* Hamburger -> X, and mismatch-safe open state (JS toggles both classes) */
.menu-toggle{ position:relative; z-index:2; }
.menu-toggle span{ transition:transform .3s var(--ease-soft), opacity .2s ease, background-color .2s ease; transform-origin:center; }
.menu-toggle.toggled-on span:nth-child(1),
.menu-toggle.is-open span:nth-child(1){ transform:translateY(7px) rotate(45deg); }
.menu-toggle.toggled-on span:nth-child(2),
.menu-toggle.is-open span:nth-child(2){ opacity:0; }
.menu-toggle.toggled-on span:nth-child(3),
.menu-toggle.is-open span:nth-child(3){ transform:translateY(-7px) rotate(-45deg); }
.site-header-menu.toggled-on{ right:0 !important; }
@media (max-width:782px){
	.site-header-menu{ transition:right .35s var(--ease-soft); }
	body.menu-open{ overflow:hidden; }
}

/* ---------- Hero: gentle motion, no jank ---------- */
.hero-slider{ isolation:isolate; }
.hero-slide{
	transition:opacity 1.1s var(--ease-soft);
}
.hero-slide img,
.hero-slide{ will-change:opacity; }
.hero-slide.is-active{
	animation:hero-ken-burns 9s var(--ease-soft) forwards;
}
@keyframes hero-ken-burns{
	from{ background-size:112% auto; }
	to{ background-size:100% auto; }
}
.hero-slide-content{ opacity:0; transform:translateY(22px); }
.hero-slide.is-active .hero-slide-content{
	animation:hero-content-in .9s var(--ease-out) .35s forwards;
}
@keyframes hero-content-in{ to{ opacity:1; transform:translateY(0); } }

.hero-arrow{ transition:background-color .25s ease, transform .25s var(--ease-out), border-color .25s ease; }
.hero-arrow:hover{ transform:translateY(-50%) scale(1.08); border-color:var(--c-gold); }
.hero-dot{ transition:transform .25s var(--ease-out), border-color .25s ease, opacity .25s ease; }

/* ---------- Card & grid hover polish ---------- */
.card, .feature, .tag-card, .process-step, .stat{
	transition:transform .35s var(--ease-out), box-shadow .35s var(--ease-out), border-color .3s ease, background-color .3s ease;
}
.tag-card:hover{
	transform:translateY(-3px);
	border-color:var(--c-gold);
	color:var(--c-forest);
	box-shadow:0 10px 24px rgba(18,54,38,.10);
}
.process-step{ transition:transform .35s var(--ease-out), background-color .3s ease, border-color .3s ease; }
.process-step:hover{ transform:translateY(-4px); background:rgba(255,255,255,.09); border-color:rgba(255,255,255,.28); }
.process-steps.vertical .process-step:hover{ box-shadow:var(--shadow-md); }
.stat{ transition:transform .3s var(--ease-out), background-color .3s ease; }
.stat:hover{ transform:translateY(-3px); background:rgba(255,255,255,.1); }

.product-card-image{ position:relative; overflow:hidden; }
.product-card-image img{ transition:transform .6s var(--ease-soft); }
.card:hover .product-card-image img{ transform:scale(1.06); }

.faq-question{ transition:color .2s ease; }
.faq-item:hover .faq-question{ color:var(--c-tan-dark); }

/* ---------- Trust strip ---------- */
.trust-item{ transition:border-color .3s ease, transform .3s var(--ease-out); }
.trust-item:hover{ border-left-color:var(--c-gold); transform:translateX(2px); }

/* ---------- Scroll reveal ---------- */
.reveal{
	opacity:0;
	transform:translateY(28px);
	transition:opacity .7s var(--ease-out), transform .7s var(--ease-out);
}
.reveal.in-view{ opacity:1; transform:translateY(0); }
.reveal-stagger.in-view > *{ opacity:1; transform:translateY(0); }
.reveal-stagger > *{
	opacity:0;
	transform:translateY(24px);
	transition:opacity .6s var(--ease-out), transform .6s var(--ease-out);
}
.reveal-stagger.in-view > *:nth-child(1){ transition-delay:.02s; }
.reveal-stagger.in-view > *:nth-child(2){ transition-delay:.08s; }
.reveal-stagger.in-view > *:nth-child(3){ transition-delay:.14s; }
.reveal-stagger.in-view > *:nth-child(4){ transition-delay:.2s; }
.reveal-stagger.in-view > *:nth-child(5){ transition-delay:.26s; }
.reveal-stagger.in-view > *:nth-child(6){ transition-delay:.32s; }
.reveal-stagger.in-view > *:nth-child(7){ transition-delay:.38s; }
.reveal-stagger.in-view > *:nth-child(8){ transition-delay:.44s; }

/* ---------- FAQ smoothness (JS sets max-height inline) ---------- */
.faq-answer{ transition:max-height .4s var(--ease-soft); }
.faq-icon{ transition:transform .3s var(--ease-soft); }

/* ---------- Back to top ---------- */
.back-to-top{
	position:fixed; right:22px; bottom:22px; z-index:60;
	width:46px; height:46px; border-radius:50%;
	background:var(--c-forest); color:#fff; border:none; cursor:pointer;
	display:flex; align-items:center; justify-content:center; font-size:18px;
	opacity:0; visibility:hidden; transform:translateY(12px);
	transition:opacity .3s ease, transform .3s var(--ease-out), background-color .25s ease, visibility .3s;
	box-shadow:0 10px 24px rgba(18,54,38,.22);
}
.back-to-top.is-visible{ opacity:1; visibility:visible; transform:translateY(0); }
.back-to-top:hover{ background:var(--c-forest-light); transform:translateY(-3px); }

/* ---------- Page load fade ---------- */
body{ animation:page-fade-in .5s var(--ease-soft); }
@keyframes page-fade-in{ from{ opacity:0; } to{ opacity:1; } }

/* ---------- Image ratio consistency ---------- */
.intro-media img{ aspect-ratio:4/3; height:auto; }
.product-detail-media img{ aspect-ratio:4/3; height:auto; }
.product-single-main-image img{ aspect-ratio:4/3; height:auto; }
@supports not (aspect-ratio: 4/3){
	.intro-media img, .product-detail-media img, .product-single-main-image img{ height:360px; }
}

/* ---------- Focus polish ---------- */
.btn:focus-visible{ outline:2px solid var(--c-gold); outline-offset:3px; }

@media (max-width:782px){
	.back-to-top{ right:16px; bottom:16px; width:42px; height:42px; }
}

/* ---------- Pragitha v3 refinement layer ---------- */
.product-card{position:relative;overflow:hidden;}
.product-card-index{display:inline-flex;align-items:center;justify-content:center;width:42px;height:42px;border:1px solid rgba(18,54,38,.16);border-radius:50%;font-size:12px;font-weight:700;letter-spacing:.08em;color:var(--c-tan-dark);margin-bottom:24px;}
.media-caption{position:absolute;left:18px;right:18px;bottom:18px;padding:16px 18px;background:rgba(18,54,38,.92);color:#fff;display:grid;grid-template-columns:auto 1fr;column-gap:12px;row-gap:3px;border-radius:10px;backdrop-filter:blur(8px);}
.media-caption span{grid-row:span 2;font-size:11px;letter-spacing:.12em;color:var(--c-gold);padding-top:2px;}
.media-caption strong{font-size:14px;}
.media-caption small{font-size:11px;opacity:.78;}
.intro-media--feature{position:relative;overflow:hidden;border-radius:var(--radius-lg);}
.intro-media--feature img{display:block;width:100%;height:100%;min-height:460px;object-fit:cover;}
.capability-panel{padding:34px;background:var(--c-forest);color:#fff;border-radius:var(--radius-lg);box-shadow:var(--shadow-lg);}
.capability-panel__top{display:flex;align-items:center;gap:16px;padding-bottom:22px;margin-bottom:8px;border-bottom:1px solid rgba(255,255,255,.14);}
.capability-panel__top span{display:inline-flex;width:50px;height:50px;border-radius:50%;align-items:center;justify-content:center;border:1px solid rgba(255,255,255,.28);font-size:12px;letter-spacing:.1em;color:var(--c-gold);}
.capability-panel__top strong{font-size:20px;}
.capability-panel__item{display:grid;grid-template-columns:42px 1fr;gap:14px;padding:22px 0;border-bottom:1px solid rgba(255,255,255,.12);}
.capability-panel__item:last-child{border-bottom:0;padding-bottom:0;}
.capability-panel__item>span{font-size:11px;letter-spacing:.12em;color:var(--c-gold);padding-top:2px;}
.capability-panel__item strong{display:block;font-size:15px;margin-bottom:4px;}
.capability-panel__item small{display:block;font-size:12px;line-height:1.55;opacity:.72;}
.documentation-grid{grid-template-columns:repeat(4,1fr);}
.documentation-grid .cert-box{display:flex;flex-direction:column;align-items:flex-start;text-align:left;gap:8px;min-height:180px;padding:28px;}
.documentation-grid .cert-box strong{font-size:12px;letter-spacing:.12em;color:var(--c-gold);}
.documentation-grid .cert-box span{font-size:16px;font-weight:700;color:var(--c-forest);}
.documentation-grid .cert-box small{font-size:12px;line-height:1.55;color:var(--c-muted);}
.sustainability-panel{min-height:420px;border-radius:var(--radius-lg);background:radial-gradient(circle at 50% 45%,rgba(194,159,90,.28),transparent 28%),linear-gradient(145deg,var(--c-forest-dark),var(--c-forest));color:#fff;padding:32px;display:flex;flex-direction:column;justify-content:space-between;box-shadow:var(--shadow-lg);overflow:hidden;position:relative;}
.sustainability-panel__label{font-size:11px;letter-spacing:.16em;color:var(--c-gold);}
.sustainability-panel__circle{width:180px;height:180px;border-radius:50%;border:1px solid rgba(255,255,255,.2);display:flex;align-items:center;justify-content:center;align-self:center;font-family:Georgia,serif;font-size:38px;letter-spacing:.02em;position:relative;}
.sustainability-panel__circle:before,.sustainability-panel__circle:after{content:"";position:absolute;border:1px solid rgba(255,255,255,.10);border-radius:50%;inset:-26px;}
.sustainability-panel__circle:after{inset:-52px;}
.sustainability-panel__items{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;}
.sustainability-panel__items span{text-align:center;border:1px solid rgba(255,255,255,.14);padding:10px 6px;font-size:11px;letter-spacing:.08em;text-transform:uppercase;}
@media (max-width:900px){
 .documentation-grid{grid-template-columns:repeat(2,1fr);}
}
@media (max-width:600px){
 .documentation-grid{grid-template-columns:1fr;}
 .intro-media--feature img{min-height:360px;}
 .capability-panel{padding:24px;}
 .sustainability-panel{min-height:360px;padding:24px;}
 .sustainability-panel__circle{width:140px;height:140px;font-size:30px;}
 .sustainability-panel__items{grid-template-columns:repeat(2,1fr);}
}
@media (prefers-reduced-motion:reduce){
 *,*::before,*::after{scroll-behavior:auto!important;animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;}
 .reveal,.reveal-stagger>*{opacity:1!important;transform:none!important;}
}
.product-detail-media--placeholder{min-height:220px;display:flex;align-items:flex-end;justify-content:flex-start;padding:22px;background:linear-gradient(145deg,var(--c-forest-dark),var(--c-forest));position:relative;overflow:hidden;}
.product-detail-media--placeholder:before,.product-detail-media--placeholder:after{content:"";position:absolute;border:1px solid rgba(255,255,255,.12);border-radius:50%;width:180px;height:180px;right:-50px;top:-50px;}
.product-detail-media--placeholder:after{width:280px;height:280px;right:-100px;top:-100px;}
.product-detail-media--placeholder span{position:relative;z-index:1;color:var(--c-gold);font-size:12px;letter-spacing:.14em;font-weight:700;}
