
/* extracted from sample.html: viliante-hero-button-visibility-v1 */
/* VILIANTE HERO BUTTON VISIBILITY V1 */
/* Makes hero buttons visible on every slide, including light images. */

/* Keep hero content/buttons always above overlays */
.hero-showcase-content,
.hero-actions,
.hero-showcase .btn {
  position: relative !important;
  z-index: 30 !important;
}

/* Button row spacing */
.hero-showcase .hero-actions {
  display: flex !important;
  align-items: center !important;
  gap: 16px !important;
  flex-wrap: wrap !important;
}

/* Base hero buttons: stronger visibility */
.hero-showcase .hero-actions .btn {
  min-height: 54px !important;
  padding: 15px 28px !important;
  border-radius: 999px !important;
  font-size: 15px !important;
  font-weight: 950 !important;
  line-height: 1 !important;
  text-decoration: none !important;
  opacity: 1 !important;
  visibility: visible !important;
  filter: none !important;
  backdrop-filter: blur(14px) saturate(140%) !important;
  -webkit-backdrop-filter: blur(14px) saturate(140%) !important;
}

/* Order Now — strong blue */
.hero-showcase .hero-actions .btn-primary {
  color: #ffffff !important;
  background: linear-gradient(135deg, #1357b7, #0a3f8d) !important;
  border: 1px solid rgba(19, 87, 183, .98) !important;
  box-shadow: 0 18px 42px rgba(19, 87, 183, .34) !important;
}

/* Get Sample — strong white */
.hero-showcase .hero-actions .btn-secondary {
  color: #0a3678 !important;
  background: rgba(255, 255, 255, .96) !important;
  border: 1px solid rgba(19, 87, 183, .24) !important;
  box-shadow: 0 16px 36px rgba(8, 12, 20, .16) !important;
}

/* Send Request / ghost button — no more invisible transparency */
.hero-showcase .hero-actions .hero-ghost,
.hero-showcase .hero-actions .btn-ghost,
.hero-showcase .hero-actions a[href*="request"] {
  color: #0a3678 !important;
  background: rgba(255, 255, 255, .88) !important;
  border: 1px solid rgba(19, 87, 183, .22) !important;
  box-shadow: 0 16px 36px rgba(8, 12, 20, .16) !important;
  opacity: 1 !important;
}

/* Hover */
.hero-showcase .hero-actions .btn:hover {
  transform: translateY(-2px) !important;
}

.hero-showcase .hero-actions .btn-primary:hover {
  box-shadow: 0 22px 48px rgba(19, 87, 183, .40) !important;
}

.hero-showcase .hero-actions .btn-secondary:hover,
.hero-showcase .hero-actions .hero-ghost:hover,
.hero-showcase .hero-actions .btn-ghost:hover,
.hero-showcase .hero-actions a[href*="request"]:hover {
  background: rgba(255, 255, 255, .98) !important;
  box-shadow: 0 20px 44px rgba(8, 12, 20, .20) !important;
}

/* Mobile: keep only Order Now + Get Sample, as already planned */
@media (max-width: 900px) {
  .hero-showcase .hero-actions {
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    gap: 10px !important;
    width: 100% !important;
  }

  .hero-showcase .hero-actions .btn {
    width: 100% !important;
    min-height: 48px !important;
    padding: 12px 14px !important;
    font-size: 14px !important;
  }

  .hero-showcase .hero-actions .hero-ghost,
  .hero-showcase .hero-actions .btn-ghost,
  .hero-showcase .hero-actions a[href*="request"] {
    display: none !important;
  }
}



/* extracted from sample.html: sample-checkout-layout-v1 */
/* Sample page split layout */
.sample-page.sample-checkout-page{
  padding:118px 18px 82px !important;
  background:
    radial-gradient(circle at 14% 18%, rgba(154,197,255,.30), transparent 32%),
    radial-gradient(circle at 72% 10%, rgba(255,221,168,.32), transparent 30%),
    radial-gradient(circle at 35% 78%, rgba(196,232,219,.20), transparent 34%),
    linear-gradient(180deg,#fff8ee 0%,#ffffff 46%,#f6efe6 100%) !important;
}

.sample-checkout-split{
  max-width:1240px;
  margin:0 auto;
  display:grid;
  grid-template-columns:minmax(520px,1fr) minmax(560px,.96fr);
  gap:44px;
  align-items:start;
}

.sample-checkout-left{
  position:sticky;
  top:112px;
  min-height:720px;
  display:flex;
  flex-direction:column;
  justify-content:flex-start;
  padding:34px 0 0;
}

.sample-kicker{
  margin:0 0 22px 4px;
  font-size:12px;
  font-weight:900;
  letter-spacing:.16em;
  text-transform:uppercase;
  color:#1b5f8f;
}

.sample-image-wrap{
  width:100%;
  min-height:540px;
  margin:0;
  display:flex;
  align-items:flex-start;
  justify-content:center;
}

.sample-image-wrap img{
  width:min(700px,116%);
  max-height:610px;
  object-fit:contain;
  display:block;
  filter:drop-shadow(0 38px 58px rgba(16,35,63,.16));
}

.sample-points{
  max-width:620px;
  margin:18px auto 0;
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:12px;
}

.sample-points div{
  min-height:90px;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  text-align:center;
  padding:14px 12px;
  border-radius:24px;
  background:rgba(255,255,255,.76);
  border:1px solid rgba(16,35,63,.10);
  box-shadow:0 18px 44px rgba(16,35,63,.07);
  backdrop-filter:blur(16px);
}

.sample-points strong{
  width:38px;
  height:38px;
  display:grid;
  place-items:center;
  border-radius:999px;
  margin:0 0 8px;
  background:rgba(21,87,183,.10);
  color:#1557b7;
  font-size:16px;
  font-weight:950;
}

.sample-points span{
  color:#102037;
  font-size:13px;
  line-height:1.25;
  font-weight:850;
}

.sample-form-card{
  padding:34px 38px;
  border-radius:30px;
  background:rgba(255,255,255,.90);
  border:1px solid rgba(16,35,63,.09);
  box-shadow:0 28px 80px rgba(16,35,63,.11);
}

.sample-form-card h1{
  margin:0 0 8px;
  font-size:clamp(34px,3.2vw,50px);
  line-height:1;
  letter-spacing:-.055em;
  color:#102037;
}

.sample-sub{
  margin:0 0 24px;
  color:#667085;
  line-height:1.55;
}

.sample-lead-form{
  display:grid;
  gap:14px;
}

.sample-form-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:14px;
}

.sample-lead-form .form-field{
  display:grid;
  gap:8px;
}

.sample-lead-form label{
  font-size:13px;
  font-weight:850;
  color:#17243a;
}

.sample-lead-form input,
.sample-lead-form select,
.sample-lead-form textarea{
  width:100%;
  min-height:56px;
  border:1px solid rgba(18,32,51,.14);
  border-radius:17px;
  padding:14px 15px;
  background:#fff;
  color:#102037;
  font:inherit;
  outline:none;
}

.sample-lead-form textarea{
  min-height:92px;
  resize:vertical;
}

.sample-lead-form input:focus,
.sample-lead-form select:focus,
.sample-lead-form textarea:focus{
  border-color:rgba(27,95,143,.55);
  box-shadow:0 0 0 4px rgba(27,95,143,.10);
}

.sample-consent{
  display:flex !important;
  align-items:flex-start;
  gap:11px;
  padding:16px 18px;
  border-radius:22px;
  background:#fff;
  border:1px solid rgba(18,32,51,.10);
  color:#667085 !important;
  line-height:1.45;
}

.sample-consent input{
  width:18px !important;
  height:18px !important;
  margin-top:1px;
}

.sample-submit{
  width:100%;
  min-height:62px;
}

@media(max-width:900px){
  .sample-page.sample-checkout-page{
    padding:96px 16px 64px !important;
  }

  .sample-checkout-split{
    grid-template-columns:1fr;
    gap:18px;
  }

  .sample-checkout-left{
    position:relative;
    top:auto;
    min-height:auto;
    padding:0;
  }

  .sample-image-wrap{
    min-height:340px;
    align-items:center;
  }

  .sample-image-wrap img{
    width:min(440px,116%);
    max-height:340px;
  }

  .sample-points{
    grid-template-columns:1fr;
    max-width:100%;
    margin-top:12px;
  }

  .sample-points div{
    min-height:72px;
    flex-direction:row;
    justify-content:flex-start;
    text-align:left;
  }

  .sample-points strong{
    margin:0 10px 0 0;
  }

  .sample-form-card{
    padding:26px;
    border-radius:28px;
  }

  .sample-form-grid{
    grid-template-columns:1fr;
  }
}



/* extracted from sample.html: sample-phone-prefix-format-css-v1 */
.sample-phone-wrap{
  display:flex;
  align-items:center;
  width:100%;
  min-height:56px;
  border:1px solid rgba(18,32,51,.14);
  border-radius:17px;
  background:#fff;
  overflow:hidden;
}

.sample-phone-prefix{
  min-height:56px;
  display:flex;
  align-items:center;
  padding:0 14px 0 16px;
  border-right:1px solid rgba(18,32,51,.10);
  color:#1557b7;
  font-weight:900;
  background:rgba(21,87,183,.06);
}

.sample-phone-wrap input{
  border:0 !important;
  box-shadow:none !important;
  border-radius:0 !important;
  min-height:54px !important;
  padding-left:14px !important;
}

.sample-phone-wrap:focus-within{
  border-color:rgba(27,95,143,.55);
  box-shadow:0 0 0 4px rgba(27,95,143,.10);
}



/* extracted from sample.html: sample-phone-prefix-visual-polish-v2 */
.sample-phone-wrap{
  border-radius:18px !important;
  background:#fff !important;
  border:1px solid rgba(18,32,51,.14) !important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.95) !important;
}

.sample-phone-prefix{
  margin-left:8px !important;
  min-height:38px !important;
  height:38px !important;
  padding:0 13px !important;
  border:0 !important;
  border-radius:999px !important;
  background:linear-gradient(135deg, rgba(21,87,183,.12), rgba(21,87,183,.06)) !important;
  color:#1557b7 !important;
  font-size:14px !important;
  font-weight:950 !important;
  letter-spacing:-.02em !important;
}

.sample-phone-wrap input{
  padding-left:12px !important;
}



/* extracted from sample.html: sample-business-only-note-v1 */
.sample-business-only-note{
  margin:0 0 22px;
  padding:14px 16px;
  border-radius:18px;
  background:rgba(21,87,183,.075);
  border:1px solid rgba(21,87,183,.14);
  color:#24445d;
  font-size:14px;
  line-height:1.45;
  font-weight:750;
}



/* extracted from sample.html: sample-phone-unified-pill-final-v1 */
.sample-phone-wrap{
  display:flex !important;
  align-items:center !important;
  width:100% !important;
  min-height:56px !important;
  border:1px solid rgba(18,32,51,.14) !important;
  border-radius:17px !important;
  background:#fff !important;
  overflow:hidden !important;
  box-shadow:none !important;
}

.sample-phone-prefix{
  width:58px !important;
  min-width:58px !important;
  height:44px !important;
  margin-left:8px !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  border-radius:999px !important;
  background:rgba(21,87,183,.10) !important;
  color:#1557b7 !important;
  font-weight:800 !important;
  font-size:16px !important;
  border:0 !important;
}

.sample-phone-wrap input{
  flex:1 !important;
  min-width:0 !important;
  height:56px !important;
  min-height:56px !important;
  padding:0 16px !important;
  border:0 !important;
  border-radius:0 !important;
  background:transparent !important;
  box-shadow:none !important;
  color:#102037 !important;
  font-size:16px !important;
  font-weight:700 !important;
}

.sample-phone-wrap:focus-within{
  border-color:rgba(27,95,143,.55) !important;
  box-shadow:0 0 0 4px rgba(27,95,143,.10) !important;
}



/* extracted from sample.html: sample-checkbox-unified-clean-final-v1 */
.sample-consent input[type="checkbox"]{
  appearance:auto !important;
  -webkit-appearance:checkbox !important;
  width:18px !important;
  min-width:18px !important;
  height:18px !important;
  min-height:18px !important;
  margin:2px 12px 0 0 !important;
  padding:0 !important;
  border-radius:3px !important;
  box-shadow:none !important;
  background:initial !important;
}

.sample-consent{
  display:flex !important;
  align-items:flex-start !important;
  gap:0 !important;
}

.sample-consent span{
  font-size:15px !important;
  line-height:1.35 !important;
  font-weight:700 !important;
  color:#34435a !important;
}



/* extracted from sample.html: sample-form-text-layout-match-order-final-v1 */
.sample-lead-form input,
.sample-lead-form select,
.sample-lead-form textarea{
  color:#102037 !important;
}

.sample-lead-form input::placeholder,
.sample-lead-form textarea::placeholder{
  color:rgba(16,32,55,.58) !important;
}

/* Make sample address section match order: street/city, state/zip */
.sample-lead-form .sample-address-grid{
  display:grid !important;
  grid-template-columns:1fr 1fr !important;
  gap:14px !important;
}

.sample-lead-form .sample-address-grid label,
.sample-lead-form .sample-address-grid .form-field{
  min-width:0 !important;
}

/* If current address fields are single-column siblings, force them into clean two-column flow */
.sample-lead-form .sample-address-field,
.sample-lead-form .sample-city-field,
.sample-lead-form .sample-state-field,
.sample-lead-form .sample-zip-field{
  min-width:0 !important;
}

@media(max-width:900px){
  .sample-lead-form .sample-address-grid{
    grid-template-columns:1fr !important;
  }
}



/* extracted from sample.html: sample-mobile-hero-no-badges-final-v1 */
@media(max-width:900px){

  .sample-points,
  .sample-mobile-product-summary,
  .sample-split-points{
    display:none !important;
  }

  .sample-checkout-left,
  .sample-left,
  .sample-visual{
    padding:18px 0 22px !important;
    margin:0 -12px 0 !important;
    min-height:auto !important;
  }

  .sample-kicker,
  .sample-checkout-left .sample-kicker,
  .sample-left .sample-kicker,
  .sample-visual .sample-kicker{
    margin:12px 0 14px !important;
    text-align:center !important;
    font-size:11px !important;
    letter-spacing:.24em !important;
  }

  .sample-image-wrap,
  .sample-visual-wrap,
  .sample-split-image-wrap{
    min-height:360px !important;
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
  }

  .sample-image-wrap img,
  .sample-visual-wrap img,
  .sample-split-image-wrap img,
  .sample-checkout-left img,
  .sample-left img,
  .sample-visual img{
    width:min(440px,94vw) !important;
    max-height:380px !important;
    object-fit:contain !important;
    filter:drop-shadow(0 36px 52px rgba(16,35,63,.20)) !important;
  }

  .sample-form-card,
  .sample-card,
  .request-form-card{
    margin-top:0 !important;
  }
}



/* extracted from sample.html: sample-mobile-form-compact-final-v1 */
@media(max-width:900px){
  .sample-form-card,
  .sample-card{
    padding:20px 18px !important;
    border-radius:26px !important;
  }

  .sample-form-card h1,
  .sample-form-card h2,
  .sample-card h1,
  .sample-card h2{
    font-size:38px !important;
    line-height:1.02 !important;
    margin-bottom:8px !important;
  }

  .sample-form-card p,
  .sample-card p{
    font-size:15px !important;
    line-height:1.4 !important;
  }

  .sample-lead-form{
    gap:10px !important;
  }

  .sample-form-grid{
    grid-template-columns:1fr 1fr !important;
    gap:10px !important;
  }

  .sample-lead-form label,
  .sample-lead-form .form-field{
    font-size:11.5px !important;
    gap:5px !important;
  }

  .sample-lead-form input,
  .sample-lead-form select,
  .sample-lead-form textarea{
    min-height:46px !important;
    border-radius:14px !important;
    padding:9px 11px !important;
    font-size:14px !important;
  }

  .sample-lead-form textarea{
    min-height:70px !important;
  }

  .sample-consent span{
    font-size:12.5px !important;
  }

  .sample-submit{
    height:52px !important;
    min-height:52px !important;
    font-size:14px !important;
  }
}



/* extracted from sample.html: sample-mobile-final-order-like-v2 */
@media(max-width:900px){

  .sample-points,
  .sample-split-points,
  .sample-mobile-product-summary{
    display:none !important;
  }

  .sample-checkout-left,
  .sample-left,
  .sample-visual{
    padding:18px 0 22px !important;
    margin:0 -12px 0 !important;
    min-height:auto !important;
  }

  .sample-kicker,
  .sample-checkout-left .sample-kicker,
  .sample-left .sample-kicker,
  .sample-visual .sample-kicker{
    margin:12px 0 14px !important;
    text-align:center !important;
    font-size:11px !important;
    letter-spacing:.24em !important;
    color:#1557b7 !important;
  }

  .sample-image-wrap,
  .sample-visual-wrap,
  .sample-split-image-wrap{
    min-height:360px !important;
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
  }

  .sample-image-wrap img,
  .sample-visual-wrap img,
  .sample-split-image-wrap img,
  .sample-checkout-left img,
  .sample-left img,
  .sample-visual img{
    width:min(440px,94vw) !important;
    max-height:380px !important;
    object-fit:contain !important;
    filter:drop-shadow(0 36px 52px rgba(16,35,63,.20)) !important;
  }

  .sample-form-card,
  .sample-card{
    margin-top:0 !important;
    padding:20px 18px !important;
    border-radius:26px !important;
  }

  .sample-lead-form{
    gap:10px !important;
  }

  .sample-form-grid{
    grid-template-columns:1fr 1fr !important;
    gap:10px !important;
  }

  .sample-phone-wrap,
  .sample-phone-wrap:focus-within,
  .phone-wrap,
  .phone-wrap:focus-within{
    height:48px !important;
    min-height:48px !important;
    max-height:48px !important;
    border-radius:14px !important;
    overflow:hidden !important;
  }

  .sample-phone-prefix,
  .phone-prefix{
    width:44px !important;
    min-width:44px !important;
    height:34px !important;
    min-height:34px !important;
    max-height:34px !important;
    margin-left:6px !important;
    font-size:13px !important;
    flex:0 0 44px !important;
  }

  .sample-phone-wrap input,
  .sample-phone-wrap input:focus,
  .sample-phone-wrap input:focus-visible,
  .phone-wrap input,
  .phone-wrap input:focus,
  .phone-wrap input:focus-visible{
    height:48px !important;
    min-height:48px !important;
    max-height:48px !important;
    font-size:14px !important;
    line-height:48px !important;
    padding:0 8px !important;
    border:0 !important;
    outline:0 !important;
    box-shadow:none !important;
    overflow:hidden !important;
  }
}



/* extracted from sample.html: sample-mobile-address-like-order-final-v1 */
@media(max-width:900px){
  .sample-address-grid{
    display:grid !important;
    grid-template-columns:1fr 1fr !important;
    gap:10px !important;
  }

  .sample-address-grid .form-field{
    min-width:0 !important;
  }

  .sample-address-grid input,
  .sample-address-grid select{
    width:100% !important;
  }
}



/* extracted from sample.html: sample-address-grid-force-mobile-final-v2 */
@media(max-width:900px){
  body .sample-page .sample-lead-form .sample-form-grid.sample-address-grid{
    display:grid !important;
    grid-template-columns:minmax(0,1fr) minmax(0,1fr) !important;
    gap:10px !important;
  }

  body .sample-page .sample-lead-form .sample-form-grid.sample-address-grid > .form-field{
    min-width:0 !important;
    width:100% !important;
  }

  body .sample-page .sample-lead-form .sample-form-grid.sample-address-grid input,
  body .sample-page .sample-lead-form .sample-form-grid.sample-address-grid select{
    width:100% !important;
    min-width:0 !important;
  }
}



/* extracted from sample.html: sample-mobile-spacing-compress-final-v1 */
@media(max-width:900px){
  .sample-page.sample-checkout-page{
    padding-top:0 !important;
  }

  .sample-checkout-left{
    padding:16px 0 10px !important;
    margin:0 -12px 0 !important;
    min-height:auto !important;
  }

  .sample-kicker{
    margin:4px 0 8px !important;
  }

  .sample-image-wrap{
    min-height:300px !important;
  }

  .sample-image-wrap img{
    width:min(430px,94vw) !important;
    max-height:315px !important;
  }

  .sample-form-card{
    margin-top:-6px !important;
  }
}



/* extracted from sample.html: sample-mobile-image-bigger-final-v1 */
@media(max-width:900px){
  .sample-image-wrap{
    min-height:390px !important;
  }

  .sample-image-wrap img{
    width:min(520px,112vw) !important;
    max-height:410px !important;
    transform:scale(1.12) !important;
    transform-origin:center center !important;
  }
}

/* VILIANTE MOBILE ORDER/SAMPLE/REQUEST OVERFLOW GUARD v1 */
@media(max-width:900px){
  html,
  body{
    max-width:100% !important;
    overflow-x:hidden !important;
  }

  .order-page,
  .sample-page,
  .request-page-clone,
  .order-checkout-page,
  .sample-checkout-page{
    width:100% !important;
    max-width:100% !important;
    overflow-x:hidden !important;
  }

  .order-checkout-split,
  .sample-checkout-split,
  .request-checkout-split{
    width:100% !important;
    max-width:100% !important;
    grid-template-columns:1fr !important;
    margin-left:0 !important;
    margin-right:0 !important;
    overflow-x:hidden !important;
  }

  .order-checkout-left,
  .sample-checkout-left,
  .request-checkout-left{
    width:100% !important;
    max-width:100% !important;
    margin-left:0 !important;
    margin-right:0 !important;
    overflow:hidden !important;
  }

  .order-split-image-wrap,
  .sample-image-wrap,
  .request-image-wrap{
    width:100% !important;
    max-width:100% !important;
    margin-left:auto !important;
    margin-right:auto !important;
    overflow:hidden !important;
  }

  .order-split-image-wrap img,
  .sample-image-wrap img,
  .request-image-wrap img{
    width:min(420px,100%) !important;
    max-width:100% !important;
    height:auto !important;
    margin-left:auto !important;
    margin-right:auto !important;
    display:block !important;
    transform:none !important;
  }

  .order-mobile-product-summary,
  .sample-mobile-product-summary,
  .request-mobile-product-summary{
    width:100% !important;
    max-width:100% !important;
    margin-left:0 !important;
    margin-right:0 !important;
    box-sizing:border-box !important;
  }

  .order-form-card,
  .sample-form-card,
  .request-form-card,
  .sample-card{
    width:100% !important;
    max-width:100% !important;
    margin-left:0 !important;
    margin-right:0 !important;
    box-sizing:border-box !important;
    overflow:hidden !important;
  }

  .order-field-grid,
  .sample-form-grid,
  .request-form-grid,
  .sample-address-grid,
  .order-address-grid{
    grid-template-columns:1fr !important;
    width:100% !important;
    max-width:100% !important;
  }

  .viliante-order-form,
  .sample-lead-form,
  .request-lead-form,
  .lead-form{
    width:100% !important;
    max-width:100% !important;
  }

  .viliante-order-form label,
  .sample-lead-form label,
  .request-lead-form label,
  .form-field{
    min-width:0 !important;
    width:100% !important;
    max-width:100% !important;
    box-sizing:border-box !important;
  }

  .viliante-order-form input,
  .viliante-order-form select,
  .viliante-order-form textarea,
  .sample-lead-form input,
  .sample-lead-form select,
  .sample-lead-form textarea,
  .request-lead-form input,
  .request-lead-form select,
  .request-lead-form textarea{
    width:100% !important;
    max-width:100% !important;
    min-width:0 !important;
    box-sizing:border-box !important;
  }

  .order-payment-grid{
    grid-template-columns:1fr !important;
    width:100% !important;
    max-width:100% !important;
  }

  .order-payment-option{
    width:100% !important;
    max-width:100% !important;
    min-width:0 !important;
    box-sizing:border-box !important;
  }
}
/* END VILIANTE MOBILE ORDER/SAMPLE/REQUEST OVERFLOW GUARD v1 */
