/* Paras — modern refresh, Phase 1 (HOME PAGE).
   Warm clay & cream design system, extending the new hero. This is an ADDITIVE
   visual layer (palette, typography, buttons, imagery, accordion, canvas) — no
   structural/layout changes, so it can't break the existing grid. Everything is
   scoped to `body.home`; to roll out site-wide later, broaden/remove that scope. */

body.home{
  --pi-cream:#F6F3EE; --pi-paper:#FFFDFA; --pi-ink:#211C17; --pi-muted:#5F574E;
  --pi-clay:#A8542F; --pi-clay-dk:#8F4828; --pi-line:rgba(33,28,23,.12);
}

/* Base page stays the theme's clean white — cream/clay are used only as
   intentional accents (hero + quote banner), never as a page-wide wash. */

/* The theme adds `.sidebar_hide .content{margin-top:10%}`, which on the home page
   shoves the full-bleed hero ~117px below the fixed white header — a big white
   band on desktop and (more visibly) on mobile. Zero it on home so the hero meets
   the header edge flush. Scoped to body.home, so inner pages keep their spacing. */
body.home .content{margin-top:0 !important;}

/* ---- typography: unify to the site fonts, warm ink + muted ---- */
body.home .content .vc_custom_heading,
body.home .content h1,body.home .content h2,body.home .content h3,body.home .content h4,
body.home .sc_item_title,body.home .sc_promo_title{
  font-family:var(--pi-head) !important;color:var(--pi-ink) !important;
  letter-spacing:-.01em;line-height:1.18;}
body.home .content p,body.home .wpb_text_column,body.home .sc_promo_descr,
body.home .vc_toggle_content{
  font-family:var(--pi-body);color:var(--pi-muted);line-height:1.8;}

/* ---- clay accent for content links (not buttons) ---- */
body.home .content a:not(.sc_button):not(.vc_btn3):not([class*="button"]):not([class*="btn"]){color:var(--pi-clay);}
body.home .content a:not(.sc_button):not(.vc_btn3):not([class*="button"]):not([class*="btn"]):hover{color:var(--pi-clay-dk);}

/* ---- buttons -> modern solid pill (clay on hover) ---- */
body.home .sc_button,body.home .vc_btn3,
body.home input[type="submit"],body.home button[type="submit"],body.home .wpcf7-submit{
  background:var(--pi-ink) !important;color:var(--pi-cream) !important;border:none !important;
  border-radius:100px !important;padding:14px 32px !important;font-family:var(--pi-body) !important;
  font-weight:600 !important;text-transform:none !important;box-shadow:none !important;
  transition:background .25s ease,transform .25s ease,color .25s ease !important;}
body.home .sc_button *{color:var(--pi-cream) !important;}
body.home .sc_button:hover,body.home .vc_btn3:hover,
body.home input[type="submit"]:hover,body.home button[type="submit"]:hover,body.home .wpcf7-submit:hover{
  background:var(--pi-clay) !important;color:#fff !important;transform:translateY(-2px);}
body.home .sc_button:hover *{color:#fff !important;}

/* ---- rounded imagery (incl. the promo background panels) ---- */
body.home .wpb_single_image img,body.home .sc_image img,body.home .content img.size-full{border-radius:16px;}
body.home .sc_promo_image{border-radius:20px;}

/* ---- FAQ accordion -> clean modern cards ---- */
body.home .vc_toggle{background:#fff !important;border:1px solid var(--pi-line) !important;
  border-radius:14px !important;margin-bottom:14px !important;padding:4px 26px !important;
  box-shadow:0 6px 22px -16px rgba(33,28,23,.26);transition:border-color .25s ease,box-shadow .25s ease;}
body.home .vc_toggle.vc_toggle_active{border-color:var(--pi-clay) !important;box-shadow:0 20px 46px -28px rgba(33,28,23,.5);}
/* one clean card surface: kill the theme's inherited gray (#f3f3f3) title-bar fill */
body.home .vc_toggle .vc_toggle_title,
body.home .vc_toggle .vc_toggle_title h6,
body.home .vc_toggle .vc_toggle_title h6.vc_custom_heading{background:transparent !important;}
body.home .vc_toggle .vc_toggle_title h6,
body.home .vc_toggle .vc_toggle_title h6.vc_custom_heading,
body.home .vc_toggle_title h4,body.home .vc_toggle_title h3{
  font-family:var(--pi-head) !important;color:var(--pi-ink) !important;font-weight:600 !important;
  font-size:17px !important;padding:15px 0 !important;margin:0 !important;line-height:1.45;}
body.home .vc_toggle_content{padding:0 0 18px 33px !important;}
/* toggle icon: solid clay disc + white +/- cross (bold accent, strong contrast) */
body.home .vc_toggle_icon{background-color:var(--pi-clay) !important;border-color:var(--pi-clay) !important;}
body.home .vc_toggle_icon::before,body.home .vc_toggle_icon::after{background-color:#fff !important;}

/* ===== Phase 1 polish: testimonials, quote banner, footer ===== */

/* ---- testimonials -> modern review cards ---- */
body.home .tss-carousel .swiper-slide{
  background:#fff !important;border:1px solid var(--pi-line);border-radius:18px;
  padding:34px 30px !important;box-shadow:0 30px 60px -42px rgba(33,28,23,.45);height:auto;}
body.home .tss-carousel .tss-meta-info,
body.home .tss-carousel h3,body.home .tss-carousel h4,body.home .tss-carousel .name{
  font-family:var(--pi-head) !important;color:var(--pi-ink) !important;}
body.home .tss-carousel p,body.home .tss-carousel .tss-content{
  font-family:var(--pi-body) !important;color:var(--pi-muted) !important;line-height:1.8 !important;}
body.home .rating-wrapper .dashicons-star-filled,
body.home .tss-carousel [class*="star"]{color:var(--pi-clay) !important;}
body.home .tss-carousel .swiper-pagination-bullet-active{background:var(--pi-clay) !important;}

/* ---- quote banner (.CTA-SEC) -> bold clay statement ---- */
body.home .CTA-SEC{
  background-color:#2d1a12 !important;
  background-image:linear-gradient(rgba(45,26,18,.56),rgba(38,22,15,.66)),url(../../../uploads/2024/11/ce593724-99de-4964-b7a1-63bdea926193-1.jpg) !important;
  background-position:center center !important;background-size:cover !important;
  background-repeat:no-repeat !important;background-attachment:fixed !important;}
/* mobile (esp. iOS) ignores fixed parallax — fall back to a normal cover image */
@media (max-width:820px){body.home .CTA-SEC{background-attachment:scroll !important;}}
body.home .CTA-SEC .vc_custom_heading{color:#fff !important;}
body.home .CTA-SEC h3.vc_custom_heading{font-family:var(--pi-head) !important;
  font-size:clamp(24px,3vw,40px) !important;line-height:1.28 !important;font-weight:600 !important;
  max-width:1000px;margin:0 auto !important;letter-spacing:-.01em;}
body.home .CTA-SEC h5.vc_custom_heading{font-family:var(--pi-body) !important;
  opacity:.9;font-weight:500 !important;margin-top:16px !important;}

/* ---- footer -> premium deep-warm, with an oversized brand watermark ---- */
/* Bookends the page in the same deep warm tone as the hero. The theme nests two
   solid-WHITE rows inside the footer (.vc_custom_… with !important) — neutralise
   them so the dark shows through, invert the dark logo, light up all text, and
   float a giant faint "PARAS" watermark bleeding off the bottom edge. */
/* full-bleed: the page is boxed (.page_wrap ~90% width), so break the footer out
   to span the full viewport like the hero does; keep the content centred at the
   site content width so it doesn't over-spread (full-width band, contained text). */
body.home .footer_wrap{position:relative;overflow:hidden;background:#19140F !important;
  width:100vw;margin-left:calc(50% - 50vw);}
body.home .footer_wrap > .vc_row,
body.home .footer_wrap .vc_row[class*="vc_custom_"]{background-color:transparent !important;position:relative;z-index:1;
  max-width:1280px;margin-left:auto !important;margin-right:auto !important;
  padding-left:clamp(20px,4vw,40px);padding-right:clamp(20px,4vw,40px);}
/* Interactive brand hover-text (vanilla recreation of the Nur-UI/Aceternity
   "TextHoverEffect"): a giant "PARAS" at the foot — faint always-on outline, and
   a clay gradient that follows the cursor on hover (driven by footer-hover.js).
   pointer-events:none so it never blocks the footer links; sits behind content. */
body.home .pi-foot-brand{position:absolute;left:0;right:0;bottom:clamp(-22px,-1.4vw,-8px);
  z-index:0;pointer-events:none;line-height:0;}
body.home .pi-foot-svg{display:block;width:100%;height:auto;overflow:visible;}
body.home .pi-foot-stroke,body.home .pi-foot-fill{
  font-family:var(--pi-head);font-weight:800;font-size:300px;letter-spacing:.02em;}
body.home .pi-foot-stroke{fill:transparent;stroke:rgba(244,236,226,.13);stroke-width:1px;}
@media (max-width:600px){body.home .pi-foot-stroke,body.home .pi-foot-fill{font-size:230px;}}
/* dark logo -> crisp white */
body.home .footer_wrap img[src*="paras-dark"],body.home .footer_wrap .sc_layouts_logo img{
  filter:brightness(0) invert(1);opacity:.95;}
/* headings */
body.home .footer_wrap h2,body.home .footer_wrap h3,body.home .footer_wrap h4,body.home .footer_wrap h5,
body.home .footer_wrap .widgettitle,body.home .footer_wrap .widget_title,body.home .footer_wrap .sc_layouts_item_title,body.home .footer_wrap .sc_title{
  font-family:var(--pi-head) !important;color:#F4ECE2 !important;font-weight:600 !important;
  font-size:16px !important;letter-spacing:.04em !important;margin-bottom:18px !important;}
/* body text + links — refined footer scale (theme default is an oversized 17px) */
body.home .footer_wrap p,body.home .footer_wrap li,body.home .footer_wrap span,body.home .footer_wrap a,
body.home .footer_wrap div,body.home .footer_wrap td{
  font-family:var(--pi-body) !important;color:rgba(244,236,226,.62) !important;
  font-size:14.5px !important;line-height:1.9 !important;letter-spacing:.005em;}
/* copyright line a touch smaller/quieter */
body.home .footer_wrap .vc_custom_1500387194305,body.home .footer_wrap .vc_custom_1500387194305 *{
  font-size:13px !important;letter-spacing:.02em;}
body.home .footer_wrap a{transition:color .2s ease;text-decoration:none;}
body.home .footer_wrap a:hover{color:var(--pi-clay) !important;}
/* footer MENU links: the theme forces them black via
   `.scheme_default footer [class*="color_style_"] li a{color:#000!important}`
   (specificity 23) — beat it with a higher-specificity selector so the nav is
   readable on the dark footer (this was the "overlapping" black-on-dark text). */
body.home .footer_wrap [class*="color_style_"] li a,
body.home .footer_wrap .menu li a,
body.home .footer_wrap ul li a{color:rgba(244,236,226,.72) !important;}
body.home .footer_wrap [class*="color_style_"] li a:hover,
body.home .footer_wrap .menu li a:hover,
body.home .footer_wrap ul li a:hover{color:var(--pi-clay) !important;}
/* social icons -> transparent disc + light ring (theme leaves them solid #fff) */
body.home .footer_wrap .sc_socials .social_icon{background:transparent !important;color:rgba(244,236,226,.82) !important;
  border:1px solid rgba(244,236,226,.26) !important;border-radius:50%;
  transition:color .2s ease,border-color .2s ease,background .2s ease;}
body.home .footer_wrap .sc_socials .social_item:hover .social_icon{
  color:#fff !important;border-color:var(--pi-clay) !important;background:var(--pi-clay) !important;}
/* hairline above the copyright bar */
body.home .footer_wrap .vc_custom_1500387194305{border-top:1px solid rgba(244,236,226,.1) !important;}

/* ===== Selected Work — editorial portfolio mosaic ===== */
body.home .pf-sec{padding:clamp(58px,7vw,104px) 0;}
body.home .pf-inner{width:min(1240px,90vw);margin:0 auto;}
body.home .pf-head{display:flex;justify-content:space-between;align-items:flex-end;gap:24px;flex-wrap:wrap;margin-bottom:clamp(28px,3.5vw,46px);}
body.home .pf-eyebrow{display:flex;align-items:center;gap:12px;margin:0 0 14px;font-family:var(--pi-body);font-size:12.5px;font-weight:600;letter-spacing:.22em;text-transform:uppercase;color:#9c5238;}
body.home .pf-line{width:42px;height:1px;background:#b0654a;display:inline-block;flex:none;}
body.home .pf-title{margin:0;font-family:var(--pi-head);font-weight:500;font-size:clamp(28px,3.6vw,46px);line-height:1.12;letter-spacing:-.015em;color:#211C17;}
body.home .pf-all{display:inline-flex;align-items:center;gap:8px;white-space:nowrap;font-family:var(--pi-body);font-size:14px;font-weight:600;color:#211C17;text-decoration:none;border-bottom:1px solid rgba(33,28,23,.3);padding-bottom:4px;transition:color .2s ease,border-color .2s ease;}
body.home .pf-all:hover{color:#b0654a;border-color:#b0654a;}
body.home .pf-all svg{width:18px;height:18px;}

body.home .pf-grid{display:grid;grid-template-columns:repeat(3,1fr);grid-auto-rows:clamp(178px,18.5vw,248px);gap:16px;}
body.home .pf-item{position:relative;display:block;overflow:hidden;text-decoration:none;background:#e6e0d8;
  border-radius:20px;box-shadow:0 26px 52px -38px rgba(33,28,23,.55);}
body.home .pf-item:nth-child(1){grid-column:span 2;grid-row:span 2;border-radius:24px;}
body.home .pf-img{position:absolute;inset:0;background:center center/cover no-repeat;transition:transform .8s cubic-bezier(.2,.7,.2,1);}
body.home .pf-item:hover .pf-img{transform:scale(1.07);}
body.home .pf-item::after{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(180deg,transparent 42%,rgba(20,16,13,.72));}
body.home .pf-cap{position:absolute;left:22px;right:18px;bottom:20px;z-index:2;display:flex;flex-direction:column;gap:2px;color:#fff;}
body.home .pf-cap b{font-family:var(--pi-head);font-weight:600;font-size:clamp(15px,1.3vw,20px);line-height:1.15;}
body.home .pf-cap i{font-family:var(--pi-body);font-style:normal;font-size:12.5px;letter-spacing:.03em;color:rgba(255,255,255,.82);}
body.home .pf-go{position:absolute;top:18px;right:18px;z-index:2;width:42px;height:42px;border-radius:50%;
  background:rgba(246,243,238,.18);-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);
  display:flex;align-items:center;justify-content:center;color:#fff;opacity:0;transform:translateY(-6px);
  transition:opacity .3s ease,transform .3s ease,background .3s ease;}
body.home .pf-go svg{width:18px;height:18px;}
body.home .pf-item:hover .pf-go{opacity:1;transform:translateY(0);background:#b0654a;}

@media (max-width:820px){
  body.home .pf-grid{grid-template-columns:1fr 1fr;grid-auto-rows:clamp(150px,40vw,220px);}
  body.home .pf-item{border-radius:18px;}
  body.home .pf-item:nth-child(1){grid-column:span 2;grid-row:span 1;border-radius:20px;}
}
@media (max-width:520px){
  body.home .pf-grid{grid-template-columns:1fr;}
  body.home .pf-item,body.home .pf-item:nth-child(1){grid-column:span 1;grid-row:span 1;border-radius:18px;}
  body.home .pf-head{flex-direction:column;align-items:flex-start;}
}

/* ===== scroll-reveal motion (home) — gated by body.pi-reveal-on (JS adds it) ===== */
body.pi-reveal-on .pi-reveal{opacity:0;transform:translateY(26px);transition:opacity .7s ease,transform .7s cubic-bezier(.2,.7,.2,1);}
body.pi-reveal-on .pi-reveal.is-in{opacity:1;transform:none;}
body.pi-reveal-on .pf-item.pi-reveal{transition-delay:.04s}
body.pi-reveal-on .pf-item:nth-child(2).pi-reveal{transition-delay:.11s}
body.pi-reveal-on .pf-item:nth-child(3).pi-reveal{transition-delay:.18s}
body.pi-reveal-on .pf-item:nth-child(4).pi-reveal{transition-delay:.25s}
body.pi-reveal-on .pf-item:nth-child(5).pi-reveal{transition-delay:.32s}
body.pi-reveal-on .pf-item:nth-child(6).pi-reveal{transition-delay:.39s}
@media (prefers-reduced-motion:reduce){body.pi-reveal-on .pi-reveal{opacity:1 !important;transform:none !important;transition:none !important;}}

/* ===== consistent section vertical rhythm =====
   The theme's per-section paddings/margins were erratic (0/30/51/60/85/119px plus
   stray 51/85px margins that doubled up). Normalize the standard content rows to one
   rhythm; leave the hero, parallax quote banner, and full-bleed fill sections alone. */
body.home .post_content > .vc_row:not(.home-hero):not(.CTA-SEC):not(.vc_row-has-fill){
  margin-top:0 !important;margin-bottom:0 !important;
  padding-top:clamp(46px,5.5vw,80px) !important;padding-bottom:clamp(46px,5.5vw,80px) !important;}