/* ==========================================================================
   Homepage (front-page.php)
   ========================================================================== */

/* ---------- Initial states for GSAP (only when motion is allowed and GSAP is loading) ---------- */
.lh-anim .lh-hero:not(.is-in) .lh-line>span{transform:translateY(112%)}
.lh-anim .lh-hero:not(.is-in) [data-hero]{opacity:0;transform:translateY(24px)}
.lh-anim .lh-hero:not(.is-in) [data-hcard]{opacity:0;transform:translateY(46px) scale(.94)}
.lh-anim #lh-hero-mask-path{stroke-dasharray:1;stroke-dashoffset:1}
.lh-anim .lh-steps__line{clip-path:inset(0 100% 0 0)}
.lh-anim [data-node]{transform:scale(.6);opacity:.35}

/* ---------- Hero ---------- */
.lh-hero{position:relative;overflow:hidden;padding:calc(var(--lh-header-h) + var(--lh-header-inset) + clamp(32px,4.5vw,72px)) 0 clamp(40px,5vw,72px)}
.lh-hero__blob{position:absolute;border-radius:50%;background:var(--lh-fog);pointer-events:none}
.lh-hero__blob--a{width:clamp(380px,50vw,1000px);aspect-ratio:1;right:-11%;top:8%}
.lh-hero__blob--b{width:clamp(160px,17vw,340px);aspect-ratio:1;right:-3%;top:-6%}
.lh-hero__grid{position:relative;display:grid;grid-template-columns:minmax(0,1.04fr) minmax(0,1fr);gap:clamp(32px,5vw,110px);align-items:center}
.lh-hero__title{font-size:clamp(38px,5.2vw,var(--lh-h1));line-height:1.04}
.lh-line{display:block;overflow:hidden;padding-bottom:.08em}
.lh-line>span{display:block}
.lh-hero__lead{margin:26px 0 34px;color:var(--lh-stone);font-size:1.12em;max-width:34em}
.lh-hero__cta{display:flex;flex-wrap:wrap;gap:16px}
.lh-trust{list-style:none;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px 28px;margin:clamp(30px,3.5vw,46px) 0 0;padding:0;max-width:580px}
.lh-trust__item{display:flex;align-items:center;gap:14px}
.lh-trust__icon{flex:none;width:46px;height:46px;border-radius:50%;background:var(--lh-fog);display:grid;place-items:center}
.lh-trust__text{display:block;font-size:14.5px;line-height:1.35;color:var(--lh-stone)}
.lh-trust__text strong{display:block;color:var(--lh-ink);font-size:15.5px;font-weight:600}

.lh-hero__visual{position:relative;display:grid;grid-template-columns:1.3fr 1fr;grid-template-rows:1.15fr 1fr;gap:clamp(12px,1.4vw,22px);height:clamp(440px,40vw,680px);margin-bottom:34px}
.lh-hcard{position:relative;margin:0;overflow:hidden;border-radius:clamp(22px,2.2vw,34px);box-shadow:var(--lh-sh-lg);display:grid;place-items:center}
.lh-hcard--a{grid-row:1/2;background:var(--lh-saddle-tint)}
.lh-hcard--b{background:var(--lh-pine-tint)}
.lh-hcard--c{background:#fff;border:1px solid var(--lh-line)}
/* Pictures are shown whole inside the card (fixed height, object-fit: contain), so nothing is cut. */
.lh-hcard img{width:100%;height:100%;object-fit:cover;object-position:center !important;padding:0px}
.lh-hcard .lh-chip{position:absolute;left:16px;bottom:16px}
.lh-stitch{position:absolute;left:-3%;bottom:-46px;width:106%;height:60px;color:var(--lh-vermilion);pointer-events:none;overflow:visible}

.lh-supply{display:flex;align-items:center;gap:14px 20px;flex-wrap:wrap;margin-top:clamp(40px,4.5vw,72px)}
.lh-supply__label{font-weight:600;font-size:15px;color:var(--lh-stone)}
.lh-supply__list{list-style:none;display:flex;flex-wrap:wrap;gap:12px;margin:0;padding:0}
.lh-supply__list li{padding:10px 18px;border:1px solid var(--lh-line);border-radius:var(--lh-r-pill);background:#fff;font-weight:500;font-size:15.5px;box-shadow:var(--lh-sh-xs);transition:transform .25s var(--lh-ease),border-color .2s}
.lh-supply__list li:hover{transform:translateY(-3px);border-color:var(--lh-ink)}

/* ---------- Two product lines ---------- */
.lh-lines__grid{display:grid;grid-template-columns:1fr 1fr;gap:clamp(20px,3vw,40px)}
.lh-line-card{background:#fff;border:1px solid var(--lh-line);border-radius:clamp(24px,2.6vw,36px);box-shadow:var(--lh-sh-md);padding:clamp(14px,1.4vw,22px);transition:transform .45s var(--lh-ease),box-shadow .45s var(--lh-ease)}
.lh-line-card:hover{transform:translateY(-8px);box-shadow:var(--lh-sh-lg)}
.lh-line-card__media{border-radius:clamp(18px,2vw,26px);height:clamp(220px,23vw,360px);display:grid;place-items:center;overflow:hidden}
.lh-line-card--leather .lh-line-card__media{background:var(--lh-saddle-tint)}
.lh-line-card--linen .lh-line-card__media{background:var(--lh-pine-tint)}
.lh-line-card__media img{width:100%;height:100%;object-fit:cover;padding:0px;transform:scale(1.04)}
.lh-line-card__body{padding:clamp(22px,2.4vw,36px) clamp(10px,1.2vw,18px) clamp(12px,1.4vw,20px)}
.lh-line-card__body h3{font-size:clamp(32px,3vw,46px);margin-bottom:10px}
.lh-line-card__body p{color:var(--lh-stone);max-width:34em}

/* ---------- How an order works ---------- */
.lh-steps{--lh-steps-gap:clamp(20px,3vw,48px)}
.lh-steps__track{position:relative}
.lh-steps__list{list-style:none;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:var(--lh-steps-gap);margin:0;padding:0;position:relative;z-index:1}
.lh-steps__line{position:absolute;z-index:0;left:40px;top:38px;height:3px;width:calc(75% + .75 * var(--lh-steps-gap));background-image:repeating-linear-gradient(90deg,var(--lh-vermilion) 0 9px,transparent 9px 17px);border-radius:3px}
.lh-step__node{display:grid;place-items:center;width:80px;height:80px;border-radius:50%;background:#fff;border:1px solid var(--lh-line);box-shadow:var(--lh-sh-md);font-family:var(--lh-font-head);font-size:34px;line-height:1;color:var(--lh-vermilion);margin-bottom:26px}
.lh-step__title{font-family:var(--lh-font-body);font-weight:600;font-size:clamp(19px,1.5vw,22px);line-height:1.3;margin-bottom:8px}
.lh-step__text{color:var(--lh-stone);font-size:16px;margin:0;max-width:20em}

/* ---------- Why Loomhide ---------- */
.lh-why__grid{display:grid;grid-template-columns:1fr 1.15fr;gap:clamp(28px,5vw,96px);align-items:center}
.lh-why__copy h2{margin-bottom:.4em;max-width:13ch}
.lh-why__copy p{color:var(--lh-stone);font-size:1.06em}
.lh-why__cards{list-style:none;display:grid;grid-template-columns:1fr 1fr;gap:clamp(14px,1.6vw,24px);margin:0;padding:0}
.lh-why__card{background:#fff;border:1px solid var(--lh-line);border-radius:var(--lh-r-xl);box-shadow:var(--lh-sh-md);padding:clamp(22px,2.2vw,32px);transition:transform .4s var(--lh-ease),box-shadow .4s var(--lh-ease)}
.lh-why__card:hover{transform:translateY(-6px);box-shadow:var(--lh-sh-lg)}
.lh-why__icon{display:grid;place-items:center;width:54px;height:54px;border-radius:50%;background:var(--lh-fog);margin-bottom:18px}
.lh-why__title{font-family:var(--lh-font-body);font-weight:600;font-size:19px;margin-bottom:6px}
.lh-why__card p{color:var(--lh-stone);font-size:15.5px;margin:0}


/* ==========================================
   LOOMHIDE — PRIVATE LABEL SECTION
========================================== */

.loomhide-private-label,
.loomhide-private-label * {
    box-sizing: border-box;
}

.loomhide-private-label {
    position: relative;
    isolation: isolate;
    display: flex;
    align-items: center;
    width: 100%;
    min-height: 340px;
    overflow: hidden;
    background-color: #24170f;
    background-image: url(/wp-content/uploads/2026/10/Luxury-Leather-Goods-and-Linens.jpg);
    background-size: cover;
    background-position: center right;
    background-repeat: no-repeat;
}

.loomhide-private-label__container {
    position: relative;
    z-index: 1;
    width: 100%;
    max-width: 1400px;
    margin: 0 auto;
    padding: 55px 0px;
}

.loomhide-private-label__content {
    width: 100%;
    max-width: 600px;
    color: #ffffff;
}

/* Eyebrow */

.loomhide-private-label__eyebrow {
    display: block;
    margin-bottom: 18px;
    color: #c93d14;
    font-size: 11px;
    font-weight: 700;
    line-height: 1.5;
    letter-spacing: 2px;
    text-transform: uppercase;
}

/* Heading */

.loomhide-private-label__content h2 {
    margin: 0 0 18px;
    padding: 0;
    color: #000;
    font-family: 'Geista Mond';
    font-size: 55px;
    font-weight: 600;
    line-height: 60px;
    text-transform: none;
}

.loomhide-private-label__content h2 span {
    color: #c93d14;
}

/* Description */

.loomhide-private-label__content p {
    max-width: 520px;
    margin: 0 0 25px;
    padding: 0;
    color: #000;
    font-family: inherit;
    font-size: 16px;
    font-weight: 400;
    line-height: 1.85;
}

/* Button */

.loomhide-private-label__button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 10px;

    min-height: 45px;
    padding: 11px 20px;

    border: 1px solid #000;
    border-radius: 5px;

    background: #000;
    color: #ffffff !important;

    font-family: inherit;
    font-size: 16px;
    font-weight: 600;
    line-height: 1.4;
    text-decoration: none !important;

    transition:
        background-color 0.25s ease,
        border-color 0.25s ease,
        color 0.25s ease;
}

.loomhide-private-label__button span {
    font-size: 19px;
    line-height: 1;
    transition: transform 0.25s ease;
}

.loomhide-private-label__button:hover {
    background-color: #c93d14;
    border-color: #c93d14;
    color: #ffffff !important;
}

.loomhide-private-label__button:hover span {
    transform: translateX(4px);
}

.loomhide-private-label__button:focus-visible {
    outline: 2px solid #e1c09a;
    outline-offset: 4px;
}



/* Reduced motion accessibility */

@media (prefers-reduced-motion: reduce) {
    .loomhide-private-label__button,
    .loomhide-private-label__button span {
        transition: none;
    }
}




/* ---------- Responsive ---------- */
@media (max-width:1024px){
  .lh-hero__title{font-size:var(--lh-h1)}
  .lh-hero__grid{grid-template-columns:1fr;gap:56px}
  .lh-hero__visual{height:clamp(380px,62vw,560px);margin-bottom:48px}
  .lh-hero__blob--a{top:30%;right:-25%}
  .lh-why__grid{grid-template-columns:1fr}
  .lh-why__copy h2{max-width:none}
}
@media (max-width:768px){
  .lh-lines__grid{grid-template-columns:1fr}
  .lh-steps__list{grid-template-columns:1fr;gap:34px}
  .lh-step{display:grid;grid-template-columns:80px 1fr;column-gap:22px;align-items:start}
  .lh-step__node{grid-row:1/3;margin:0}
  .lh-step__title{align-self:end;margin:0}
  .lh-step__text{grid-column:2}
  .lh-steps__line{left:39px;top:40px;width:3px;height:auto;bottom:90px;background-image:repeating-linear-gradient(180deg,var(--lh-vermilion) 0 9px,transparent 9px 17px)}
  .lh-anim .lh-steps__line{clip-path:inset(0 0 100% 0)}
}
@media (max-width:600px){
  .lh-trust{grid-template-columns:1fr}
  .lh-hero__visual{height:clamp(340px,92vw,460px);gap:10px}
  .lh-hero__cta .lh-btn{flex:1 1 100%}
  .lh-why__cards{grid-template-columns:1fr}
  .lh-supply__list li{font-size:14.5px;padding:9px 14px}
  .lh-stitch{display:none}
}
@media (prefers-reduced-motion:reduce){
  .lh-anim .lh-hero:not(.is-in) .lh-line>span,.lh-anim .lh-hero:not(.is-in) [data-hero],.lh-anim .lh-hero:not(.is-in) [data-hcard],.lh-anim [data-node]{transform:none;opacity:1}
  .lh-anim .lh-steps__line{clip-path:none}
}



/* ==========================================
   TABLET
========================================== */

@media (max-width: 1024px) {
    .loomhide-private-label {
        min-height: 330px;
        background-position: 70% center;
        background-image: url(/wp-content/uploads/2026/10/Luxury-Leather-Goods-and-Linens.jpg);
    }

    .loomhide-private-label__container {
        padding: 45px 30px;
    }

    .loomhide-private-label__content {
        max-width: 490px;
    }

    .loomhide-private-label__content h2 {
        font-size: 44px;
        line-height: 45px;
    }
}

/* ==========================================
   MOBILE
========================================== */

@media (max-width: 600px) {
    .loomhide-private-label {
        min-height: 390px;
        background-position: left;
        background-image: url(/wp-content/uploads/2026/10/Luxury-Leather-Goods-and-Linens.jpg);
    }

    .loomhide-private-label__container {
        padding: 55px 22px;
    }

    .loomhide-private-label__content {
        max-width: 100%;
    }

    .loomhide-private-label__eyebrow {
        margin-bottom: 15px;
        font-size: 10px;
        letter-spacing: 1.7px;
    }

    .loomhide-private-label__content h2 {
        max-width: 430px;
        margin-bottom: 17px;
        font-size: 38px;
        line-height: 1.18;
    }

    .loomhide-private-label__content p {
        max-width: 420px;
        margin-bottom: 23px;
        font-size: 13px;
        line-height: 1.8;
    }

    .loomhide-private-label__button {
        min-height: 44px;
        padding: 11px 17px;
        font-size: 13px;
    }
}