/*
Theme Name: El Capricho Tarragona
Theme URI: https://www.elcaprichotarragona.com/
Author: Manus AI
Description: Thème WordPress chaleureux et dynamique pour El Capricho, bar à tapas à Tarragona.
Version: 1.0.0
Text Domain: el-capricho
@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@400;500;600;700;800&display=swap');
*/

:root{--cream:#fff8ea;--cream-2:#f6e7c9;--tomato:#a8322a;--red:#8f2925;--saffron:#e9b949;--cacao:#2d1d1a;--muted:#756057;--line:rgba(50,36,31,.17);--serif:Georgia,'Times New Roman',serif;--sans:Arial,Helvetica,sans-serif;--ease:cubic-bezier(.23,1,.32,1)}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--cream);color:#32241f;font:15px/1.65 var(--sans);-webkit-font-smoothing:antialiased}a{color:inherit;text-decoration:none}img{display:block;max-width:100%;height:auto}button{font:inherit;cursor:pointer}button:focus-visible,a:focus-visible{outline:2px solid var(--saffron);outline-offset:4px}.container{width:min(100% - 5rem,1320px);margin-inline:auto}.skip-link{position:fixed;left:1rem;top:-3rem;z-index:100;padding:.7rem 1rem;background:var(--tomato);color:#fff8ea}.skip-link:focus{top:1rem}
.site-header{position:fixed;z-index:20;top:0;right:0;left:0;color:var(--cream);transition:.3s var(--ease)}.site-header.scrolled{color:var(--cacao);background:rgba(255,248,234,.95);box-shadow:0 1px 0 var(--line);backdrop-filter:blur(12px)}.topline{display:flex;justify-content:space-between;min-height:30px;border-bottom:1px solid rgba(255,248,234,.25);font-size:10px;font-weight:700;letter-spacing:.16em;text-transform:uppercase}.scrolled .topline{border-color:var(--line);color:var(--muted)}.nav-wrap{display:flex;align-items:center;justify-content:space-between;min-height:82px;gap:2rem}.brand{display:flex;align-items:center;gap:.6rem}.brand img{width:42px;height:42px}.brand-copy{display:flex;flex-direction:column;font-size:12px;font-weight:800;letter-spacing:.16em;line-height:.9}.brand-copy small{color:var(--saffron);font-size:10px;letter-spacing:.12em}.main-nav{display:flex;align-items:center;gap:2.2rem;margin-left:auto;font-size:11px;font-weight:800;letter-spacing:.12em;text-transform:uppercase}.main-nav a{opacity:.84;transition:opacity .18s,color .18s}.main-nav a:hover{opacity:1;color:var(--saffron)}.booking-link{padding:.75rem .95rem;border:1px solid currentColor;opacity:1!important}.nav-actions{display:flex;align-items:center;gap:1rem}.phone{font-size:11px;font-weight:800;letter-spacing:.06em;white-space:nowrap}.menu-toggle{display:none;border:0;background:none;color:currentColor}
.hero{position:relative;min-height:760px;display:flex;align-items:center;overflow:hidden;background:var(--cacao);color:var(--cream);isolation:isolate}.hero-bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-2}.hero:after{position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,rgba(45,29,26,.94),rgba(45,29,26,.52) 48%,rgba(45,29,26,.1)),linear-gradient(0deg,rgba(45,29,26,.7),transparent 55%);content:""}.hero-content{padding-top:8rem;padding-bottom:5rem}.eyebrow{margin:0 0 1.2rem;color:var(--tomato);font-size:11px;font-weight:800;letter-spacing:.18em;text-transform:uppercase}.eyebrow:before{content:'✦';margin-right:.55rem;color:var(--saffron)}.hero .eyebrow{color:#f6c8a5}.hero h1{max-width:750px;margin:0;font-size:clamp(58px,9vw,128px);font-weight:900;letter-spacing:-.09em;line-height:.8}.hero h1 em{font-family:var(--serif);font-weight:400}.hero-copy{max-width:340px;margin:2rem 0 0 8rem;color:rgba(255,248,234,.8);font-size:15px}.actions{display:flex;gap:.7rem;margin:2rem 0 0 8rem}.button{display:inline-flex;align-items:center;gap:.55rem;padding:.95rem 1.15rem;border:1px solid transparent;font-size:11px;font-weight:800;letter-spacing:.13em;text-transform:uppercase;transition:.18s var(--ease)}.button-primary{background:var(--tomato);color:var(--cream)}.button-primary:hover{background:var(--red);transform:translateY(-2px)}.button-outline{border-color:rgba(255,248,234,.55);color:var(--cream)}.button-outline:hover{background:var(--cream);color:var(--cacao);transform:translateY(-2px)}.hero-badge{position:absolute;right:8%;bottom:5rem;display:flex;align-items:center;gap:.5rem;color:var(--saffron);font-size:10px;font-weight:800;letter-spacing:.12em;line-height:1.15;text-transform:uppercase;transform:rotate(-9deg)}.badge-star{display:grid;place-items:center;width:46px;height:46px;border:1px solid var(--saffron);border-radius:50%;font-size:22px}.scroll-cue{position:absolute;right:2rem;bottom:4rem;color:var(--cream);font-size:10px;font-weight:800;letter-spacing:.14em;text-transform:uppercase;writing-mode:vertical-rl;transform:rotate(180deg)}
.section{padding:clamp(90px,13vw,170px) 0}.cream{background:var(--cream)}.saffron{background-color:var(--saffron);background-image:repeating-linear-gradient(135deg,rgba(255,248,234,.2) 0 1px,transparent 1px 13px)}.tomato{background:var(--tomato);color:var(--cream)}.grid-3{display:grid;grid-template-columns:7rem minmax(260px,1fr) minmax(280px,.75fr);gap:clamp(2rem,6vw,7rem);align-items:start}.section-number{color:var(--tomato);font-size:11px;font-weight:800;letter-spacing:.15em}.section-number span{display:inline-block;width:32px;height:1px;margin-left:.5rem;background:currentColor;vertical-align:middle}.cartouche{display:inline-flex;gap:.5rem;align-items:center;margin-bottom:1.2rem;padding:.45rem .6rem;border:1px solid currentColor;color:var(--tomato);font-size:9px;font-weight:800;letter-spacing:.15em;text-transform:uppercase}.cartouche:before{width:5px;height:5px;border-radius:50%;background:currentColor;content:''}.tomato .cartouche{color:#f6c8a5}.section h2{margin:0;font-size:clamp(50px,6.5vw,95px);font-weight:900;letter-spacing:-.09em;line-height:.82}.section h2 em{font-family:var(--serif);font-weight:400}.copy{padding-top:2.8rem;color:var(--muted);font-size:14px}.tomato .copy{color:rgba(255,248,234,.78)}.copy .lead{color:var(--cacao);font:24px/1.25 var(--serif)}.tomato .copy .lead{color:var(--cream)}.text-link{display:inline-flex;gap:.45rem;margin-top:1rem;padding-bottom:.35rem;border-bottom:1px solid currentColor;color:var(--tomato);font-size:10px;font-weight:800;letter-spacing:.13em;text-transform:uppercase}.tomato .text-link{color:var(--saffron)}
.story-grid{display:grid;grid-template-columns:minmax(280px,.9fr) minmax(300px,.8fr);gap:clamp(3rem,9vw,11rem);align-items:center}.story-image{position:relative;width:min(100%,480px);margin-left:5rem}.story-image:before{position:absolute;inset:1.5rem -1.5rem -1.5rem 1.5rem;border:1px dashed rgba(255,248,234,.55);content:''}.story-image img{position:relative;width:100%;aspect-ratio:3/4;object-fit:cover}.details{display:flex;gap:2rem;margin-top:2.5rem;padding-top:1rem;border-top:1px solid rgba(255,248,234,.35)}.details strong{display:block;color:#f6c8a5;font:32px/1 var(--serif)}.details small{display:block;margin-top:.45rem;color:rgba(255,248,234,.65);font-size:9px;font-weight:800;letter-spacing:.1em;text-transform:uppercase}
.menu-head{display:grid;grid-template-columns:1fr .6fr;gap:4rem;align-items:end}.menu-intro{color:var(--muted);font-size:14px}.tabs{display:flex;gap:.5rem;flex-wrap:wrap;margin:5rem 0 1.5rem 25%;padding-bottom:1rem;border-bottom:1px solid var(--line)}.tabs button{padding:.55rem .75rem;border:0;background:transparent;color:var(--muted);font-size:10px;font-weight:800;letter-spacing:.11em;text-transform:uppercase}.tabs button.active,.tabs button:hover{background:var(--tomato);color:var(--cream)}.menu-list{margin-left:25%}.menu-item{display:grid;grid-template-columns:2rem minmax(0,auto) 1fr auto;gap:1rem;align-items:baseline;padding:1rem .65rem;border-bottom:1px solid var(--line);transition:.18s var(--ease)}.menu-item:hover{background:rgba(233,185,73,.22);transform:translateX(5px)}.menu-item-no{color:var(--tomato);font-size:10px;font-weight:800}.menu-item h3{margin:0;font:600 23px/1.1 var(--serif)}.menu-item p{margin:.2rem 0 0;color:var(--muted);font-size:11px}.dots{height:1px;background:var(--line)}.price{color:var(--tomato);font:22px var(--serif);white-space:nowrap}.menu-foot{display:flex;justify-content:space-between;margin:1.2rem 0 0 25%;color:var(--muted);font-size:10px}
.gallery-head{display:flex;justify-content:space-between;align-items:end;gap:3rem}.gallery-head p{max-width:300px;font:22px/1.2 var(--serif)}.gallery-grid{display:grid;grid-template-columns:1.1fr .7fr .9fr;gap:1rem;margin-top:4rem}.gallery-card{position:relative;overflow:hidden;padding:0;border:0;background:none;text-align:left}.gallery-card:nth-child(1){margin-top:3rem}.gallery-card:nth-child(3){margin-top:6rem}.gallery-card img{width:100%;height:380px;object-fit:cover;transition:transform .75s var(--ease)}.gallery-card:nth-child(1) img{height:480px}.gallery-card:nth-child(2) img{height:410px}.gallery-card:nth-child(3) img{height:340px}.gallery-card:hover img{transform:scale(1.05)}.gallery-card span{position:absolute;right:1rem;bottom:1rem;left:1rem;display:flex;justify-content:space-between;padding:.7rem;background:var(--tomato);color:var(--cream);font-size:10px;font-weight:800;letter-spacing:.12em;text-transform:uppercase}
.reservation{position:relative;overflow:hidden;padding:clamp(90px,11vw,150px) 0;background:var(--cacao);color:var(--cream)}.reservation:before{position:absolute;inset:0;background:linear-gradient(90deg,rgba(45,29,26,.96),rgba(45,29,26,.68)),var(--reservation-image) center/cover;content:'';opacity:.95}.reservation-inner{position:relative;display:grid;grid-template-columns:1fr 390px;gap:6rem;align-items:center}.reservation h2{font-size:clamp(58px,7vw,110px)}.reservation-copy{padding-left:6rem}.reservation-copy p{max-width:360px;color:rgba(255,248,234,.75)}.reservation-card{padding:2.2rem;background:var(--cream);color:var(--cacao);box-shadow:10px 10px 0 var(--tomato)}.reservation-card h3{margin:2rem 0 .8rem;font:600 42px/.85 var(--serif)}.reservation-card p{color:var(--muted);font-size:13px}.wide{width:100%;justify-content:center}.phone-link{display:block;margin:1rem 0;text-align:center;color:var(--tomato);font-size:11px;font-weight:800;letter-spacing:.1em}.hours{display:flex;gap:.6rem;padding-top:1rem;border-top:1px solid var(--line);color:var(--muted);font-size:11px}
.map-strip{padding:2rem 0;background:var(--red);color:var(--cream)}.map-inner{display:flex;align-items:center;gap:1rem}.map-mark{display:grid;place-items:center;width:44px;height:44px;border:1px solid rgba(255,248,234,.5);border-radius:50%}.map-strip .eyebrow{margin:0;color:#f6c8a5}.map-strip h2{margin:0;font:28px/.95 var(--serif)}.map-strip h2 span{font-size:20px;color:rgba(255,248,234,.7)}.map-link{margin-left:auto;color:var(--cream)}
.site-footer{background:var(--cacao);color:var(--cream)}.footer-main{display:grid;grid-template-columns:1.1fr 1fr .8fr .7fr;gap:3rem;padding:5rem 0 4rem}.footer-main .brand img{width:52px;height:52px}.footer-manifesto{margin:0;font:36px/.88 var(--serif)}.footer-contact,.footer-nav{display:flex;flex-direction:column;gap:.35rem;font-size:12px}.footer-contact .eyebrow,.footer-nav .eyebrow{color:#f6c8a5}.footer-bottom{display:flex;justify-content:space-between;padding:1rem 0;border-top:1px solid rgba(255,248,234,.2);color:rgba(255,248,234,.5);font-size:10px}.footer-bottom span:last-child{display:flex;gap:1rem}
.lightbox{position:fixed;z-index:60;inset:0;display:grid;place-items:center;padding:3rem;background:rgba(45,29,26,.94)}.lightbox img{max-width:min(80vw,900px);max-height:80vh}.lightbox button{position:absolute;border:0;background:none;color:var(--cream)}.lightbox-close{top:1.5rem;right:1.5rem}.lightbox-prev{left:1.5rem}.lightbox-next{right:1.5rem}.lightbox figcaption{display:flex;justify-content:space-between;color:var(--cream);font-size:11px}
[data-reveal]{opacity:0;transform:translateY(24px);transition:.7s var(--ease)}[data-reveal].visible{opacity:1;transform:none}
@media(max-width:800px){.container{width:min(100% - 2.4rem,1320px)}.topline span:last-child,.phone span{display:none}.nav-wrap{min-height:74px}.menu-toggle{display:block}.main-nav{position:absolute;top:104px;right:1.2rem;left:1.2rem;display:none;flex-direction:column;align-items:stretch;gap:0;padding:.8rem;background:var(--cream);color:var(--cacao);box-shadow:0 18px 40px rgba(45,29,26,.2)}.main-nav.open{display:flex}.main-nav a{padding:.8rem;border-bottom:1px solid var(--line)}.booking-link{text-align:center;border:0!important;background:var(--tomato);color:var(--cream)!important}.hero{min-height:760px}.hero-content{padding-bottom:6rem}.hero h1{font-size:clamp(55px,16vw,90px)}.hero-copy,.actions{margin-left:2.2rem}.hero-badge{right:1rem;bottom:4rem}.scroll-cue{right:1rem}.grid-3,.story-grid,.menu-head,.reservation-inner{grid-template-columns:1fr;gap:2.5rem}.section-number{order:-1}.welcome-heading,.copy,.story-copy,.reservation-copy{padding-left:2.2rem}.copy{padding-top:0}.story-image{width:calc(100% - 2rem);margin-left:0}.tabs,.menu-list,.menu-foot{margin-left:0}.menu-item{grid-template-columns:1.4rem minmax(0,1fr) auto;gap:.6rem}.dots{display:none}.gallery-head{display:grid}.gallery-head p{margin-left:2.2rem}.gallery-grid{grid-template-columns:1fr 1fr}.gallery-card:nth-child(1){grid-row:span 2;margin-top:2rem}.gallery-card:nth-child(2),.gallery-card:nth-child(3){margin-top:0}.gallery-card img,.gallery-card:nth-child(1) img,.gallery-card:nth-child(2) img,.gallery-card:nth-child(3) img{height:250px}.gallery-card:nth-child(1) img{height:520px}.reservation-copy{padding-left:2.2rem}.reservation-card{margin-left:2.2rem;padding:1.6rem}.map-inner{flex-wrap:wrap}.map-link{width:100%;margin-left:3.5rem}.footer-main{grid-template-columns:1fr 1fr;gap:2.5rem 1.5rem}.footer-manifesto{grid-column:span 2;grid-row:1}.footer-main>.brand{grid-column:span 2;grid-row:2}.footer-bottom{flex-direction:column;gap:.5rem}.footer-bottom span:last-child{gap:.7rem}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{animation-duration:.01ms!important;transition-duration:.01ms!important}}

/* =========================
   FILTRE DE LA CARTA
========================= */

.tabs {
    display: flex;
    flex-wrap: wrap;
    gap: .6rem;
    margin: 2rem 0;
}

.menu-filter {
    appearance: none;
    border: 1px solid var(--line);
    background: transparent;
    color: inherit;
    padding: .65rem 1rem;
    font: inherit;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: .1em;
    text-transform: uppercase;
    cursor: pointer;
    transition:
        background .18s ease,
        color .18s ease,
        border-color .18s ease,
        transform .18s ease;
}

.menu-filter:hover {
    border-color: var(--saffron);
    color: var(--saffron);
}

.menu-filter.active {
    background: var(--cacao);
    border-color: var(--cacao);
    color: var(--cream);
}

.menu-filter:focus-visible {
    outline: 2px solid var(--saffron);
    outline-offset: 3px;
}

.menu-item {
    transition:
        opacity .18s ease,
        transform .18s ease;
}

.menu-item.filter-hidden {
    opacity: 0;
    transform: translateY(-6px);
}

.menu-item[hidden] {
    display: none;
}

.menu-category {
    display: inline-block;
    margin-top: .35rem;
    font-size: 9px;
    font-weight: 700;
    letter-spacing: .1em;
    text-transform: uppercase;
    opacity: .6;
}

/* =========================================================
/* =========================================================
   LOGO HEADER
========================================================= */

.site-header .brand {
    display: inline-flex;
    align-items: center;
    gap: .6rem;
    height: 42px;
}

.site-header .brand .custom-logo-link {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 42px;
    height: 42px;
    flex: 0 0 42px;
    overflow: hidden;
}

.site-header .brand .custom-logo {
    display: block;
    width: 42px;
    height: 42px;
    max-width: 42px;
    max-height: 42px;
    object-fit: contain;
}

.site-header .brand-copy {
    display: flex;
    flex-direction: column;
    line-height: .9;
}
    display: flex;
    flex-direction: column;
    line-height: .9;
}

/* =========================================================
   NAVIGATION PAR ANCRES
========================================================= */

html {
    scroll-behavior: smooth;
    scroll-padding-top: 120px;
}

section[id] {
    scroll-margin-top: 120px;
}

/* =========================================================
   POPUPS LEGALES
========================================================= */

.legal-popup {
    position: fixed;
    inset: 0;
    z-index: 9999;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 2rem;
    visibility: hidden;
    opacity: 0;
    pointer-events: none;
    transition:
        opacity .25s ease,
        visibility .25s ease;
}

.legal-popup.is-open {
    visibility: visible;
    opacity: 1;
    pointer-events: auto;
}


/* Fond sombre */

.legal-popup-overlay {
    position: absolute;
    inset: 0;
    background: rgba(45, 29, 26, .72);
    backdrop-filter: blur(5px);
}


/* Fenêtre */

.legal-popup-content {
    position: relative;
    z-index: 2;

    width: min(900px, 100%);
    max-height: min(82vh, 800px);

    overflow-y: auto;

    padding: 4rem 4.5rem;

    background: var(--cream);
    color: var(--cacao);

    box-shadow: 0 30px 100px rgba(0, 0, 0, .3);

    transform: translateY(20px) scale(.98);

    transition: transform .25s ease;
}

.legal-popup.is-open .legal-popup-content {
    transform: translateY(0) scale(1);
}


/* Bouton fermer */

.legal-popup-close {
    position: absolute;
    top: 1.2rem;
    right: 1.4rem;

    width: 42px;
    height: 42px;

    border: 0;
    background: transparent;

    color: var(--cacao);

    font-family: inherit;
    font-size: 32px;
    font-weight: 300;
    line-height: 1;

    cursor: pointer;

    transition:
        color .18s ease,
        transform .18s ease;
}

.legal-popup-close:hover {
    color: var(--tomato);
    transform: rotate(90deg);
}


/* Titre */

.legal-popup-content h2 {
    margin: .5rem 0 2.5rem;

    font-family: var(--serif);
    font-size: clamp(42px, 6vw, 72px);
    font-weight: 400;
    line-height: .9;
}


/* Texte */

.legal-popup-text {
    max-width: 700px;

    font-size: 15px;
    line-height: 1.75;
}

.legal-popup-text p {
    margin: 0 0 1.5rem;
}

.legal-popup-text h3 {
    margin: 2rem 0 .6rem;

    font-size: 12px;
    font-weight: 800;
    letter-spacing: .12em;
    text-transform: uppercase;
}


/* Empêcher le scroll de la page derrière le popup */

body.legal-popup-open {
    overflow: hidden;
}


/* =========================================================
   POPUPS — MOBILE
========================================================= */

@media (max-width: 800px) {

    .legal-popup {
        padding: 1rem;
    }

    .legal-popup-content {
        max-height: 90vh;
        padding: 3.5rem 1.6rem 2.5rem;
    }

    .legal-popup-content h2 {
        margin-bottom: 2rem;
        font-size: clamp(40px, 13vw, 58px);
    }

    .legal-popup-text {
        font-size: 14px;
        line-height: 1.7;
    }

    .legal-popup-close {
        top: .8rem;
        right: .8rem;
    }
}

/* =========================================================
   HEADER — POPPINS
========================================================= */

.site-header,
.site-header .topline,
.site-header .brand,
.site-header .brand-copy,
.site-header .main-nav,
.site-header .main-nav a,
.site-header .booking-link,
.site-header .phone,
.site-header .menu-toggle {
    font-family: 'Poppins', sans-serif;
}

.site-header .brand-copy {
    font-weight: 700;
}

.site-header .main-nav {
    font-weight: 600;
}

.site-header .phone {
    font-weight: 600;
}

/* =========================================================
   HEADER — LA CARTA
========================================================= */

.site-header .main-nav a[href*="#carta"] {
    padding: .75rem .95rem;
    border: 1px solid currentColor;
    opacity: 1;
}

.site-header .main-nav a[href*="#carta"]:hover {
    color: var(--saffron);
    opacity: 1;
}

.whatsapp-icon {
    width: 18px;
    height: 18px;
    flex: 0 0 18px;
    fill: currentColor;
}

.button:has(.whatsapp-icon) {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: .55rem;
}

.whatsapp-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: .6rem;
}

.whatsapp-button .whatsapp-icon {
    width: 18px;
    height: 18px;
    flex: 0 0 18px;
    fill: currentColor;
}


/* =========================================================
   WHATSAPP — BOUTON RESERVAR
========================================================= */

.whatsapp-button {
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    gap: .6rem;

    color: #25D366 !important;
    border: 1px solid #25D366 !important;
    background: transparent !important;

    opacity: 1 !important;
    transition: background .2s ease, color .2s ease, border-color .2s ease;
}

.whatsapp-button .whatsapp-icon {
    width: 18px;
    height: 18px;
    flex: 0 0 18px;
    fill: currentColor;
}

.whatsapp-button:hover {
    color: #ffffff !important;
    background: #25D366 !important;
    border-color: #25D366 !important;
    opacity: 1 !important;
}

/* =========================================================
   GOOGLE MAPS BUTTON
========================================================= */

.google-maps-button {
    display: inline-flex !important;
    align-items: center;
    gap: .55rem;
}

.google-maps-icon {
    width: 18px;
    height: 18px;
    flex: 0 0 18px;
    fill: currentColor;
}


/* =========================================================
   CAPRICHO — CUSTOM GREEN CURSOR
   ========================================================= */

/* Hide the native browser cursor everywhere */
html,
body,
body * {
    cursor: none !important;
}

/* Small green cursor point */
.capricho-cursor-dot {
    position: fixed;
    top: -3px;
    left: -3px;
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: #43d17a;
    z-index: 999999;
    pointer-events: none;
    transform: translate(0, 0);
    box-shadow: 0 0 10px rgba(67, 209, 122, .55);
}

/* Outer cursor ring */
.capricho-cursor-ring {
    position: fixed;
    top: -17px;
    left: -17px;
    width: 34px;
    height: 34px;
    border: 1px solid rgba(67, 209, 122, .75);
    border-radius: 50%;
    z-index: 999998;
    pointer-events: none;
    transform: translate(0, 0);
    transition:
        width .2s ease,
        height .2s ease,
        top .2s ease,
        left .2s ease,
        border-color .2s ease,
        background .2s ease;
}

/* Hover state */
.capricho-cursor-ring.hover {
    width: 48px;
    height: 48px;
    top: -24px;
    left: -24px;
    border-color: #43d17a;
    background: rgba(67, 209, 122, .06);
    box-shadow:
        0 0 18px rgba(67, 209, 122, .22);
}

/* Don't use the custom cursor on touch devices */
@media (pointer: coarse) {
    html,
    body,
    body * {
        cursor: auto !important;
    }

    .capricho-cursor-dot,
    .capricho-cursor-ring {
        display: none;
    }
}

@media (prefers-reduced-motion: reduce) {
    .capricho-cursor-dot,
    .capricho-cursor-ring {
        display: none;
    }

    html,
    body,
    body * {
        cursor: auto !important;
    }
}


/* =========================================================
   CAPRICHO — SCROLL PROGRESS
   ========================================================= */

.capricho-scroll-progress {
    position: absolute;
    top: 100%;
    left: 0;
    width: 100%;
    height: 3px;
    z-index: 99990;
    pointer-events: none;
    background: transparent;
}

.capricho-scroll-progress-bar {
    width: 0;
    height: 100%;
    background: #174D32;
    box-shadow: 0 0 8px rgba(23, 77, 50, .35);
}

/* =========================================================
   CAPRICHO — PREVIOUS SECTION
   ========================================================= */

.capricho-back-section {
    position: fixed;
    right: 25px;
    bottom: 25px;
    width: 48px;
    height: 48px;
    border: 1px solid #174D32;
    border-radius: 50%;
    background: #174D32;
    color: #FFF8EA;
    font-size: 22px;
    font-weight: 700;
    z-index: 99990;
    display: grid;
    place-items: center;
    opacity: 0;
    visibility: hidden;
    transform: translateY(15px);
    transition:
        opacity .25s ease,
        transform .25s ease,
        visibility .25s ease,
        background .2s ease,
        box-shadow .2s ease;
}

.capricho-back-section.visible {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
}

.capricho-back-section:hover {
    background: #236B46;
    transform: translateY(-3px);
    box-shadow: 0 0 20px rgba(23, 77, 50, .35);
}

@media (max-width: 700px) {
    .capricho-scroll-progress {
        top: 100%;
    }

    .capricho-back-section {
        right: 18px;
        bottom: 18px;
        width: 44px;
        height: 44px;
    }
}
