/* Homepage (agent F) — loaded only on the homepage (inc/40-home.php). Markup = Elementor page + mu-plugins costos-homepage-v2 / proposal-e-css. */

/* Hero slider without Swiper: the .swiper-wrapper is a scroll-snap row, one slide per view (≥768px; mobile shows the static cards). */
.costos-hp-v2 .cs-hero-swiper{position:relative;display:flex}
.costos-hp-v2 .cs-hero-swiper .swiper-wrapper{display:flex;flex:1;width:100%;overflow-x:auto;overflow-y:hidden;scroll-snap-type:x mandatory;scrollbar-width:none;overscroll-behavior-x:contain}
.costos-hp-v2 .cs-hero-swiper .swiper-wrapper::-webkit-scrollbar{display:none}
.costos-hp-v2 .cs-hero-swiper .cs-hero-slide{flex:0 0 100%;width:100%;scroll-snap-align:start;scroll-snap-stop:always}
.costos-hp-v2 .cs-swiper-prev,.costos-hp-v2 .cs-swiper-next{position:absolute;top:50%;z-index:3;margin-top:-20px;display:flex;align-items:center;justify-content:center;cursor:pointer;border:0;padding:0;font:700 18px/1 system-ui,sans-serif}
.costos-hp-v2 .cs-swiper-prev::after{content:"‹"}
.costos-hp-v2 .cs-swiper-next::after{content:"›"}
.costos-hp-v2 .cs-swiper-prev:focus-visible,.costos-hp-v2 .cs-swiper-next:focus-visible{outline:2px solid #fff;outline-offset:2px}
.costos-hp-v2 .cs-swiper-pagination{position:absolute;left:0;right:0;z-index:3;display:block;text-align:center;line-height:22.5px}
.costos-hp-v2 .cs-swiper-pagination .swiper-pagination-bullet{display:inline-block;vertical-align:middle;width:6px;height:6px;margin:0 6px;border-radius:50%;border:0;padding:0;cursor:pointer}

/* The Elementor page sits in the theme's full-width <main> (already right of the 60px rail): cancel the
   100vw breakout of costos-homepage-v2 (written for Woodmart's boxed container) — it pushed the page 30px right. */
/* Live geometry: ≥1025px the page is 100vw minus the 60px rail wide, starting at the rail (it runs under the scrollbar,
   so its centred content sits 7.5px right of the visible centre); ≤1024px it is 100vw, centred (plugin rule). The
   overflow is clipped by the main element (no horizontal scroll). */
body.home .ns-main{overflow-x:clip}
@media (min-width:1025px){.ns-main .costos-hp-v2.e-con{width:calc(100vw - var(--nsc-rail-w,60px))!important;max-width:calc(100vw - var(--nsc-rail-w,60px))!important;margin-left:0!important;margin-right:0!important}}

/* Slogan: was <h2>, now <p> (SEO #42) — same look as the heading rules of costos-homepage-v2. */
.costos-hp-v2 .hero-left .elementor-element-cv20001 p.elementor-heading-title{font-family:'Geologica','Cfontbold',Arial,sans-serif!important;font-weight:900!important;color:#fff!important;line-height:1.15!important;letter-spacing:-.03em!important;margin:0 0 20px!important;max-width:none!important}
.costos-hp-v2 .hero-left .elementor-element-cv20001 p.elementor-heading-title .highlight{color:var(--copper-light,#C4873B)!important;display:block}
/* Showroom facts on phones: «Ετοιμοπαράδοτα» broke mid-word at 28px */
@media (max-width:480px){.costos-hp-v2 .fact-val,.costos-hp-v2 .fact-val *,.costos-hp-v2 .fact-val p{font-size:21px!important}}

/* Homepage newsletter (real costos-newsletter form in widget cv20100) laid out like the live mock-up: 269px block,
   215px field + green «Εγγραφή» button on one row (button overflows the block, as live); stacked and centred on phones.
   The consent line (not on live) hangs below without changing the row height. */
.costos-hp-v2 .nsc-hp-nl{position:relative;width:269px;max-width:none;flex:none}
.costos-hp-v2 .nsc-hp-nl .ecnl-row{display:flex;flex-wrap:nowrap;gap:8px}
.costos-hp-v2 .nsc-hp-nl .ecnl-email{flex:0 0 215px;width:215px;height:42px;padding:11px 18px;font:400 13px/1.5 'Cfontmedium','Cfont',Arial,sans-serif;color:#777;background:#fff;border:2px solid #E8E6E1;border-radius:6px}
.costos-hp-v2 .nsc-hp-nl button[type=submit],.costos-hp-v2 .nsc-hp-nl .ecnl-btn{flex:none;height:49px;min-height:0;padding:14px 28px;font:700 14px/1.2 'Cfontbold','Cfont',Arial,sans-serif;color:#fff;background:#12562D;border:2px solid #12562D;border-radius:8px;text-transform:none}
.costos-hp-v2 .nsc-hp-nl .ecnl-consent{position:absolute;top:100%;left:0;width:346px;margin-top:8px;font-size:11px;line-height:1.4;color:var(--ns-soft,#4a4a4a)}
@media (max-width:768px){.costos-hp-v2 .nsc-hp-nl{width:215px;margin-inline:auto}.costos-hp-v2 .nsc-hp-nl .ecnl-row{flex-direction:column}.costos-hp-v2 .nsc-hp-nl button[type=submit],.costos-hp-v2 .nsc-hp-nl .ecnl-btn{width:100%}.costos-hp-v2 .nsc-hp-nl .ecnl-consent{position:static;width:auto}}
/* Products tabs container: full boxed width like the live carousel (a content-sized flex child shrank it to 895px) */
.costos-hp-v2 .e-con:has(>.elementor-widget-wd_products_tabs),.costos-hp-v2 .elementor-widget-wd_products_tabs{width:100%}
/* Products tabs + newsletter keep their live widths inside the flex containers */
.costos-hp-v2 :is(.e-con,.e-con-inner):has(>.elementor-widget-wd_products_tabs){width:100%!important}
.costos-hp-v2 .elementor-element-cv20100{flex:none!important}
/* Newsletter row = live geometry (868px: text column grows, 269px form block), the mock-up's intrinsic width */
@media (min-width:769px){.costos-hp-v2 .elementor-element-cv20101{width:868px!important;max-width:100%!important}.costos-hp-v2 .elementor-element-cv20099{flex:1 1 auto!important}.costos-hp-v2 .elementor-element-cv20100{width:269px!important}}
/* Slogan (<p>) on tablets/phones: same clamp as the plugin's .hero-left h2 rule (live: 56px @1024, 42px @768, 40px @390) */
@media (max-width:1024px){.costos-hp-v2 .hero-left .elementor-element-cv20001 p.elementor-heading-title{font-size:clamp(40px,5.5vw,72px)!important}}

/* Final parity pass (10/11/2026): on the live homepage the product-tab card titles are <h3> and get the page's
   `.costos-hp-v2 h3{font-family:Geologica…;line-height:1.15}` rule → Geologica 700 15/17.25 #242424 at every width.
   Our card title is a <p> (one-H1/heading-order SEO choice), so the same look is set here. */
.costos-hp-v2 ul.products li.product.nsc-card .woocommerce-loop-product__title{font-family:'Geologica','Cfontbold',Arial,sans-serif!important;font-size:15px!important;line-height:1.15!important;color:#242424}
/* Homepage tab cards: the page's own resets zero the card body padding / buy-bar margin; live rhythm (1440):
   image +12 title · stock +8 · price +17 · buy bar +9. */
.costos-hp-v2 .nsc-hptabs ul.products li.product.nsc-card .nsc-card__body{padding-top:15px}
.costos-hp-v2 .nsc-hptabs ul.products li.product.nsc-card p.stock{margin-top:-1px}
.costos-hp-v2 .nsc-hptabs ul.products li.product.nsc-card .nsc-card__price{margin-top:8px}
.costos-hp-v2 .nsc-hptabs ul.products li.product.nsc-card .nsc-card__buy{margin-top:7px}
/* phones: live does not clamp these titles to two lines */
@media (max-width:576px){.costos-hp-v2 .nsc-hptabs ul.products li.product.nsc-card .woocommerce-loop-product__title{display:block;-webkit-line-clamp:unset;overflow:visible}}
/* the page resets also cancel the carousel's −5px gutters (cards were 3px narrower at 1440, 5px at 390) */
.costos-hp-v2 .nsc-hptabs .nsc-row-wrap{margin-left:-5px!important;margin-right:-5px!important}