/* ==========================================================
   base.css — Global foundation
   Breakpoints: 598 / 898 / 1198 / 1438 / 1918
   ========================================================== */

*,*::before,*::after{box-sizing:border-box}

html{
    font-family:var(--jyl-font);
    font-size:16px;
    line-height:var(--jyl-lh-normal);
    color:var(--jyl-grey-dark);
    background:var(--jyl-white);
    scroll-behavior:auto;
    -webkit-font-smoothing:antialiased;
    -moz-osx-font-smoothing:grayscale;
}
body{margin:0;overflow-x:hidden}

::-webkit-scrollbar{width:10px;height:10px}
::-webkit-scrollbar-track{background:transparent}
::-webkit-scrollbar-thumb{border-radius:var(--jyl-radius-full);background:rgba(0,0,0,0.2)}
.jyl-dark ::-webkit-scrollbar-thumb{background:var(--jyl-beige-dark)}

::selection{background:var(--jyl-black);color:var(--jyl-white)}
.jyl-dark ::selection{background:var(--jyl-white);color:var(--jyl-black)}

a{color:inherit;text-decoration:none;transition:color var(--jyl-t200) var(--jyl-ease)}
h1,h2,h3,h4,h5,h6{margin:0;font-family:var(--jyl-font);font-weight:var(--jyl-fw-medium);line-height:var(--jyl-lh-tight)}
p{margin:0}
img{display:block;max-width:100%;height:auto}

/* ---- Santiago accent override ---- */
.rey-btn--primary,.button.alt,
.woocommerce #respond input#submit.alt,
.woocommerce a.button.alt,
.woocommerce button.button.alt,
.woocommerce input.button.alt{
    background:var(--jyl-blue)!important;color:var(--jyl-white)!important;border-color:var(--jyl-blue)!important;
}
.rey-btn--primary:hover,.button.alt:hover{background:var(--jyl-blue-dark)!important}
.rey-productBadge--new,.rey-productBadge--sale{background:var(--jyl-blue)}

/* ---- Header glassmorphism ---- */
#site-header, .rey-siteHeader {
    transition: transform var(--jyl-t300) var(--jyl-ease);
}
.rey-header-top, #top-header, .rey-siteHeader__inner {
    background: rgba(122,122,122,.20);
    backdrop-filter: blur(20px); -webkit-backdrop-filter: blur(20px);
    border-bottom: 1px solid rgba(248,248,248,.30);
    height: var(--jyl-hdr-h);
    transition: background var(--jyl-t300) var(--jyl-ease), height var(--jyl-t500) var(--jyl-ease);
}
@media (min-width: 898px) {
    .rey-header-top, #top-header, .rey-siteHeader__inner { height: var(--jyl-hdr-h-desk) }
}
.jyl-hdr--scrolled .rey-header-top,
.jyl-hdr--scrolled #top-header,
.jyl-hdr--scrolled .rey-siteHeader__inner {
    background: rgba(26,26,26,.88); border-color: rgba(239,238,236,.12);
}
.jyl-hdr--hidden { transform: translateY(-100%) }
.rey-siteLogo svg, .rey-siteLogo img { max-height: 32px; transition: max-height var(--jyl-t200) var(--jyl-ease) }
@media (min-width: 898px) { .rey-siteLogo svg, .rey-siteLogo img { max-height: 50px } }

.rey-siteNav > ul > li > a{
    font-size:var(--jyl-fs-14);font-weight:var(--jyl-fw-medium);
    letter-spacing:var(--jyl-ls-md);color:var(--jyl-white);
    position:relative;padding-bottom:8px;
}
.rey-siteNav > ul > li > a::after{
    content:'';position:absolute;bottom:0;left:0;
    width:100%;height:1px;background:currentColor;
    transform:scaleX(0);transform-origin:left;
    transition:transform var(--jyl-t300) var(--jyl-ease);
}
.rey-siteNav > ul > li:hover > a::after,
.rey-siteNav > ul > li.current-menu-item > a::after{transform:scaleX(1)}

.rey-searchForm input[type="text"],
.rey-searchForm input[type="search"]{
    border-radius:var(--jyl-radius-full);
    border:1px solid transparent;
    background:var(--jyl-beige-light);
    padding-left:40px;
    font-size:var(--jyl-fs-14);letter-spacing:var(--jyl-ls-md);
    color:var(--jyl-black);box-shadow:var(--jyl-shadow-sm);
    transition:border-color var(--jyl-t200) var(--jyl-ease);
    outline:none;height:48px;
}
.rey-searchForm input:hover{border-color:var(--jyl-beige-dark)}
.rey-searchForm input:focus{border-color:var(--jyl-blue);box-shadow:none}

/* ---- Button system ---- */
.jyl-btn{
    display:inline-flex;align-items:center;justify-content:center;gap:6px;
    padding:12px 24px;font-family:var(--jyl-font);font-size:var(--jyl-fs-14);
    font-weight:var(--jyl-fw-medium);letter-spacing:0;border-radius:var(--jyl-radius-sm);
    border:1px solid transparent;cursor:pointer;text-decoration:none;white-space:nowrap;outline:none;
    transition:background var(--jyl-t200) var(--jyl-ease),color var(--jyl-t200) var(--jyl-ease),border-color var(--jyl-t200) var(--jyl-ease);
}
.jyl-btn--dark{background:var(--jyl-grey-dark);color:var(--jyl-white)}
.jyl-btn--dark:hover{background:var(--jyl-grey-medium)}
.jyl-btn--blue{background:rgba(42,55,245,.90);color:var(--jyl-white)}
.jyl-btn--blue:hover{background:var(--jyl-blue)}
.jyl-btn--ghost{background:transparent;border-color:var(--jyl-beige-medium);color:var(--jyl-black)}
.jyl-btn--ghost:hover{background:var(--jyl-beige-xlight);border-color:var(--jyl-beige-dark)}

a.elementor-button.jyl-btn--dark,
.elementor-widget-button .elementor-button.jyl-btn--dark{
    background-color:var(--jyl-grey-dark);border-radius:var(--jyl-radius-sm);
    color:var(--jyl-white);font-size:var(--jyl-fs-14);font-weight:var(--jyl-fw-medium);
}
a.elementor-button.jyl-btn--dark:hover,
.elementor-widget-button .elementor-button.jyl-btn--dark:hover{
    background-color:var(--jyl-grey-medium);color:var(--jyl-white);
}
a.elementor-button.jyl-btn--blue,
.elementor-widget-button .elementor-button.jyl-btn--blue{
    background-color:rgba(42,55,245,.90);border-radius:var(--jyl-radius-sm);
    color:var(--jyl-white);font-size:var(--jyl-fs-14);font-weight:var(--jyl-fw-medium);
}
a.elementor-button.jyl-btn--blue:hover,
.elementor-widget-button .elementor-button.jyl-btn--blue:hover{
    background-color:var(--jyl-blue);color:var(--jyl-white);
}

/* ---- Icon button (circle) ---- */
.jyl-icon-btn{
    position:relative;display:inline-flex;align-items:center;justify-content:center;
    width:40px;height:40px;border-radius:var(--jyl-radius-full);
    background:var(--jyl-beige-medium);color:var(--jyl-black);
    border:none;cursor:pointer;overflow:hidden;flex-shrink:0;
    transition:color var(--jyl-t200) var(--jyl-ease);z-index:0;
    text-decoration:none;
}
.jyl-icon-btn::after{
    content:'';position:absolute;inset:0;border-radius:var(--jyl-radius-full);
    background:var(--jyl-blue);opacity:0;transform:scale(0);
    transition:opacity var(--jyl-t200) var(--jyl-ease),transform var(--jyl-t200) var(--jyl-ease);z-index:-1;
}
.jyl-icon-btn:hover{color:var(--jyl-white)}
.jyl-icon-btn:hover::after{opacity:1;transform:scale(1.1)}
.jyl-icon-btn > *{position:relative;z-index:10}
.jyl-icon-btn svg{display:block;flex-shrink:0}
.jyl-icon-btn--disabled{opacity:.4;cursor:not-allowed;pointer-events:none}

/* ---- Section utilities ---- */
.jyl-section-title{
    font-size:var(--jyl-fs-24);font-weight:var(--jyl-fw-medium);
    line-height:var(--jyl-lh-tight);color:var(--jyl-black);overflow:hidden;
}
@media(min-width:898px){.jyl-section-title{font-size:1.5625rem}}
@media(min-width:1198px){.jyl-section-title{font-size:var(--jyl-fs-32)}}
.jyl-dark .jyl-section-title{color:var(--jyl-white)}

.jyl-spacer{height:25px;border-bottom:1px solid var(--jyl-beige-medium)}

/* ---- Scroll animation placeholder ---- */
[data-jyl-animate]{opacity:0}
.rey-revealElement{opacity:1!important;transform:none!important}

/* ---- Elementor overrides ---- */
.elementor-section.e-full-width-stretch{padding-left:0!important;padding-right:0!important}
.elementor-section > .elementor-container{max-width:var(--jyl-max-w)}
.elementor-widget-slides .swiper-wrapper{transition-timing-function:var(--jyl-ease)!important}

/* ---- Dark mode globals ---- */
.jyl-dark body{background:var(--jyl-black);color:var(--jyl-white)}
.jyl-dark h1,.jyl-dark h2,.jyl-dark h3,.jyl-dark h4{color:var(--jyl-white)}
.jyl-dark .jyl-btn--dark{background:var(--jyl-beige-xlight);color:var(--jyl-black)}
.jyl-dark .jyl-btn--dark:hover{background:var(--jyl-beige-dark)}
.jyl-dark .jyl-icon-btn{background:var(--jyl-grey-medium);color:var(--jyl-white)}
.jyl-dark .rey-siteHeader__inner,.jyl-dark .rey-header-top{background:rgba(0,0,0,.88)}

/* ---- Utilities ---- */
.jyl-sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.jyl-no-scrollbar{-ms-overflow-style:none;scrollbar-width:none}
.jyl-no-scrollbar::-webkit-scrollbar{display:none}
.jyl-glass{background:rgba(122,122,122,.20);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px)}

/* ---- Newsletter ---- */
.jyl-newsletter-form{display:flex;flex-direction:column;align-items:center;gap:var(--jyl-gap-sm)}
.jyl-newsletter-form input[type="email"]{
    width:100%;max-width:400px;height:48px;padding:0 1.25rem;
    border:1px solid var(--jyl-beige-medium);border-radius:var(--jyl-radius-full);
    font-size:var(--jyl-fs-14);font-family:var(--jyl-font);color:var(--jyl-grey-dark);
    outline:none;background:var(--jyl-white);transition:border-color var(--jyl-t200) var(--jyl-ease);
}
.jyl-newsletter-form input:focus{border-color:var(--jyl-blue)}
.jyl-newsletter-msg{font-size:var(--jyl-fs-14);text-align:center;min-height:1.5em}
.jyl-newsletter-msg.is-success{color:var(--jyl-success)}
.jyl-newsletter-msg.is-error{color:var(--jyl-error)}

/* ---- Footer nav/legal ---- */
.jyl-footer-nav__col-title{font-size:var(--jyl-fs-14);font-weight:var(--jyl-fw-medium);letter-spacing:var(--jyl-ls-md);color:var(--jyl-black)}
.jyl-dark .jyl-footer-nav__col-title{color:var(--jyl-white)}
.jyl-footer-nav__link{font-size:var(--jyl-fs-14);letter-spacing:var(--jyl-ls-md);color:var(--jyl-black);transition:color var(--jyl-t200) var(--jyl-ease);display:block;margin-bottom:1rem}
.jyl-footer-nav__link:hover{color:var(--jyl-blue)}
.jyl-dark .jyl-footer-nav__link{color:var(--jyl-white)}
.jyl-social-link{display:inline-flex;align-items:center;gap:12px;font-size:var(--jyl-fs-14);letter-spacing:var(--jyl-ls-md);color:var(--jyl-black);transition:color var(--jyl-t200) var(--jyl-ease)}
.jyl-social-link:hover{color:var(--jyl-blue)}
.jyl-dark .jyl-social-link{color:var(--jyl-white)}
.jyl-footer-legal,.jyl-footer-legal a{font-size:var(--jyl-fs-12);letter-spacing:var(--jyl-ls-sm);color:var(--jyl-grey-light);line-height:var(--jyl-lh-normal)}
.jyl-footer-legal a:hover{color:var(--jyl-blue)}
.jyl-dark .jyl-footer-legal,.jyl-dark .jyl-footer-legal a{color:rgba(255,255,255,.70)}
