:root{
--pink:#ff0f72;
--pink-dark:#dc0a61;
--coral:#ff5a43;
--orange:#ff8a18;
--yellow:#ffd21f;
--turquoise:#00aebd;
--turquoise-dark:#008896;
--cream:#fff4df;
--white:#fff;
--ink:#20232a;
--muted:#62656c;
--shadow:0 18px 45px rgba(34,28,24,.18);
--radius:22px;
--max-width:1440px;
}

*{
margin:0;
padding:0;
box-sizing:border-box;
}

html{
scroll-behavior:smooth;
}

body{
font-family:"Montserrat",sans-serif;
background:#fff;
color:var(--ink);
overflow-x:hidden;
}

body.menu-open{
overflow:hidden;
}

img{
display:block;
max-width:100%;
}

a{
color:inherit;
text-decoration:none;
}

button,input,select,textarea{
font:inherit;
}

.container{
width:min(92%,var(--max-width));
margin:auto;
}

.site-header{
position:absolute;
top:0;
left:0;
width:100%;
z-index:1000;
padding-top:max(12px,env(safe-area-inset-top));
transition:.3s;
}

.site-header.scrolled{
position:fixed;
background:rgba(236,18,94,.94);
backdrop-filter:blur(18px);
box-shadow:0 8px 30px rgba(79,0,32,.18);
}

.nav-wrap{
height:100px;
display:flex;
align-items:center;
justify-content:space-between;
gap:28px;
}

.site-logo{
width:165px;
flex:0 0 auto;
}

.site-logo img{
width:100%;
height:auto;
}

.desktop-nav{
display:flex;
align-items:center;
gap:36px;
}

.desktop-nav a{
position:relative;
font-size:.82rem;
font-weight:800;
color:#fff;
text-transform:uppercase;
letter-spacing:.035em;
}

.desktop-nav a::after{
content:"";
position:absolute;
left:0;
bottom:-12px;
width:0;
height:3px;
background:var(--yellow);
transition:.25s;
}

.desktop-nav a:hover::after,
.desktop-nav a.active::after{
width:100%;
}

.nav-book{
padding:15px 24px;
border-radius:7px;
background:linear-gradient(135deg,var(--orange),var(--pink));
color:#fff;
font-size:.78rem;
font-weight:800;
text-transform:uppercase;
box-shadow:0 12px 30px rgba(255,15,114,.34);
transition:.25s;
}

.nav-book:hover{
transform:translateY(-3px);
box-shadow:0 16px 35px rgba(255,15,114,.45);
}

.menu-toggle{
display:none;
width:50px;
height:50px;
border:1px solid rgba(255,255,255,.35);
border-radius:12px;
background:rgba(255,255,255,.1);
cursor:pointer;
}

.menu-toggle span{
display:block;
width:22px;
height:2px;
margin:5px auto;
background:#fff;
transition:.25s;
}

.mobile-menu{
display:none;
}

.hero{
position:relative;
min-height:760px;
display:flex;
align-items:center;
overflow:hidden;
background:
linear-gradient(90deg,rgba(220,5,86,.8) 0%,rgba(245,57,78,.45) 38%,rgba(0,142,166,.1) 100%),
url("../images/gallery/karma-two-palms-beach-samui-08.webp") center/cover no-repeat;
}

.hero::after{
    content:"";
    position:absolute;
    left:-2%;
    right:-2%;
    bottom:-1px;
    height:34px;
    z-index:4;

    background:#fff;
    clip-path:polygon(
        0 55%,
        8% 42%,
        18% 54%,
        29% 34%,
        42% 50%,
        55% 31%,
        68% 48%,
        82% 30%,
        92% 45%,
        100% 35%,
        100% 100%,
        0 100%
    );
}

.hero-overlay{
position:absolute;
inset:0;
background:
radial-gradient(circle at 34% 40%,rgba(255,211,32,.42),transparent 24%),
linear-gradient(to bottom,rgba(255,20,102,.16),rgba(0,137,164,.18));
}

.hero-grid{
position:relative;
z-index:3;
display:grid;
grid-template-columns:.9fr 1.1fr;
align-items:center;
gap:40px;
padding-top:115px;
}

.hero-copy{
max-width:650px;
color:#fff;
}

.hero-kicker{
display:block;
margin-bottom:20px;
font-size:1rem;
font-weight:800;
letter-spacing:.04em;
text-transform:uppercase;
}

.hero-copy h1{
font-family:"Barlow Condensed",sans-serif;
font-size:clamp(5.5rem,10vw,10rem);
font-weight:900;
line-height:.72;
letter-spacing:-.035em;
text-transform:uppercase;
text-shadow:0 12px 30px rgba(90,0,30,.2);
}

.hero-copy h2{
margin:15px 0 28px;
font-family:"Yellowtail",cursive;
font-size:clamp(4rem,7vw,7.5rem);
font-weight:400;
line-height:.8;
color:var(--yellow);
transform:rotate(-3deg);
text-shadow:0 10px 25px rgba(133,49,0,.25);
}

.hero-copy p{
max-width:600px;
font-size:1.08rem;
font-weight:600;
line-height:1.75;
}

.hero-actions{
display:flex;
gap:18px;
flex-wrap:wrap;
margin-top:34px;
}

.btn{
display:inline-flex;
align-items:center;
justify-content:center;
min-height:56px;
padding:0 30px;
border-radius:7px;
font-size:.85rem;
font-weight:800;
text-transform:uppercase;
transition:.25s;
}

.btn-pink{
background:linear-gradient(135deg,var(--coral),var(--pink));
color:#fff;
box-shadow:0 14px 35px rgba(255,15,114,.35);
}

.btn-pink:hover{
transform:translateY(-3px);
box-shadow:0 18px 40px rgba(255,15,114,.48);
}

.btn-outline{
border:2px solid rgba(255,255,255,.85);
color:#fff;
background:rgba(0,126,151,.16);
backdrop-filter:blur(10px);
}

.btn-outline:hover{
background:#fff;
color:var(--pink);
transform:translateY(-3px);
}

.hero-event{
position:relative;
min-height:520px;
display:flex;
align-items:center;
justify-content:center;
}

.hero-event::before{
content:"";
position:absolute;
width:520px;
height:520px;
border-radius:50%;
background:
radial-gradient(circle,var(--yellow) 0%,rgba(255,190,22,.78) 42%,rgba(255,83,57,0) 72%);
filter:blur(2px);
}

.hero-event img{
position:absolute;
right:-40px;
bottom:-35px;
width:min(620px,55vw);
z-index:3;
filter:drop-shadow(0 25px 35px rgba(38,8,15,.3));
}

.event-copy{
position:absolute;
top:80px;
left:40px;
z-index:5;
display:flex;
flex-direction:column;
align-items:flex-start;
transform:rotate(-4deg);
}

.event-title{
padding:4px 18px;
background:var(--pink);
font-family:"Barlow Condensed",sans-serif;
font-size:clamp(4.4rem,6vw,7.5rem);
font-weight:900;
line-height:.9;
color:#fff;
text-transform:uppercase;
box-shadow:12px 12px 0 rgba(255,98,47,.65);
}

.event-script{
margin:5px 0 8px 38px;
font-family:"Yellowtail",cursive;
font-size:clamp(3rem,4vw,5rem);
line-height:1;
color:#fff;
text-shadow:0 6px 18px rgba(103,0,37,.25);
}

.event-date,
.event-time{
margin-left:50px;
padding:7px 18px;
background:#fff;
color:var(--pink-dark);
font-size:1.05rem;
font-weight:900;
text-transform:uppercase;
}

.event-time{
margin-top:6px;
margin-left:95px;
background:var(--pink);
color:#fff;
}

.quick-features{
position:relative;
z-index:10;
padding:38px 0;
background:#fff;
}

.feature-grid{
display:grid;
grid-template-columns:repeat(5,1fr);
}

.feature-item{
display:flex;
align-items:flex-start;
gap:18px;
padding:12px 28px;
border-right:1px solid #ddd;
}

.feature-item:last-child{
border-right:0;
}

.feature-item i{
flex:0 0 auto;
font-size:2.35rem;
color:var(--pink);
}

.feature-item h3{
margin-bottom:8px;
font-size:.9rem;
font-weight:800;
color:var(--turquoise-dark);
text-transform:uppercase;
}

.feature-item p{
font-size:.78rem;
line-height:1.7;
color:var(--muted);
}

@media(max-width:1180px){
.desktop-nav{
gap:20px;
}
.desktop-nav a{
font-size:.73rem;
}
.hero-grid{
grid-template-columns:1fr 1fr;
}
.event-copy{
left:0;
}
.feature-grid{
grid-template-columns:repeat(3,1fr);
gap:25px 0;
}
.feature-item:nth-child(3){
border-right:0;
}
}

@media(max-width:900px){
.site-header{
position:fixed;
background:rgba(236,18,94,.94);
backdrop-filter:blur(18px);
}
.nav-wrap{
height:98px;
}
.site-logo{
width:150px;
}
.desktop-nav,.nav-book{
display:none;
}
.menu-toggle{
display:block;
}
.mobile-menu{
position:fixed;
top:78px;
left:0;
right:0;
display:flex;
flex-direction:column;
gap:4px;
padding:24px;
background:rgba(222,8,89,.98);
transform:translateY(-130%);
opacity:0;
visibility:hidden;
transition:.3s;
}
.mobile-menu.active{
transform:translateY(0);
opacity:1;
visibility:visible;
}
.mobile-menu a{
padding:15px 10px;
border-bottom:1px solid rgba(255,255,255,.16);
font-weight:800;
color:#fff;
text-transform:uppercase;
}
.mobile-book{
margin-top:10px;
border:0!important;
border-radius:8px;
background:var(--orange);
text-align:center;
}
.hero{
min-height:auto;
padding:130px 0 80px;
}
.hero-grid{
grid-template-columns:1fr;
text-align:center;
}
.hero-copy{
margin:auto;
}
.hero-actions{
justify-content:center;
}
.hero-event{
min-height:470px;
}
.hero-event img{
right:50%;
bottom:-55px;
width:min(680px,95vw);
transform:translateX(50%);
}
.event-copy{
top:40px;
left:50%;
align-items:center;
transform:translateX(-50%) rotate(-3deg);
}
.event-date,.event-time,.event-script{
margin-left:0;
}
.feature-grid{
grid-template-columns:1fr 1fr;
}
.feature-item{
border-right:0;
border-bottom:1px solid #ddd;
}
}

@media(max-width:560px){
.hero-copy h1{
font-size:5.2rem;
}
.hero-copy h2{
font-size:4rem;
}
.hero-event{
min-height:390px;
}
.event-title{
font-size:4rem;
}
.event-script{
font-size:3rem;
}
.feature-grid{
grid-template-columns:1fr;
}
.feature-item{
padding:22px 10px;
}
.hero-actions{
flex-direction:column;
}
.btn{
width:100%;
}
}

.weekly-events{
position:relative;
padding:80px 0 70px;
background:
linear-gradient(rgba(255,243,221,.93),rgba(255,243,221,.93)),
url("../images/sand-texture.jpg") center/cover;
overflow:hidden;
}

.weekly-events::before,
.weekly-events::after{
content:"";
position:absolute;
top:0;
width:240px;
height:240px;
background:url("../images/palm-leaf.png") center/contain no-repeat;
opacity:.9;
pointer-events:none;
}

.weekly-events::before{
left:-70px;
transform:rotate(15deg);
}

.weekly-events::after{
right:-70px;
transform:scaleX(-1) rotate(15deg);
}

.section-heading{
max-width:760px;
margin:0 auto 48px;
}

.section-heading.centre{
text-align:center;
}

.section-kicker{
display:inline-block;
margin-bottom:12px;
font-size:.8rem;
font-weight:800;
letter-spacing:.13em;
text-transform:uppercase;
color:var(--pink);
}

.section-heading h2{
font-family:"Barlow Condensed",sans-serif;
font-size:clamp(2.8rem,5vw,4.8rem);
font-weight:900;
line-height:.95;
text-transform:uppercase;
color:var(--pink);
}

.section-heading p{
margin-top:16px;
line-height:1.8;
color:var(--muted);
}

.week-grid{
display:grid;
grid-template-columns:repeat(7,1fr);
position:relative;
z-index:2;
background:rgba(255,255,255,.55);
border:1px solid rgba(255,117,104,.18);
box-shadow:var(--shadow);
}

.day-card{
min-height:220px;
padding:24px 18px;
text-align:center;
border-right:1px solid rgba(44,44,44,.15);
transition:.25s;
}

.day-card:last-child{
border-right:0;
}

.day-card:hover{
background:#fff;
transform:translateY(-6px);
box-shadow:0 16px 35px rgba(255,34,112,.12);
}

.day{
display:block;
margin-bottom:16px;
font-size:.75rem;
font-weight:900;
text-transform:uppercase;
color:var(--pink);
}

.day-card i{
font-size:2rem;
color:var(--pink);
margin-bottom:16px;
}

.day-card h3{
font-size:.92rem;
line-height:1.25;
text-transform:uppercase;
}

.day-card p{
margin-top:10px;
font-size:.72rem;
line-height:1.6;
color:var(--muted);
}

.events-action{
position:relative;
z-index:2;
display:flex;
justify-content:center;
margin-top:34px;
}

.experience-grid{
display:grid;
grid-template-columns:repeat(4,1fr);
padding:0;
}

.experience-card{
position:relative;
height:390px;
overflow:hidden;
}

.experience-card::after{
content:"";
position:absolute;
inset:0;
background:linear-gradient(to top,rgba(13,20,29,.86),rgba(13,20,29,.08) 65%);
transition:.35s;
}

.experience-card img{
width:100%;
height:100%;
object-fit:cover;
transition:.6s;
}

.experience-card:hover img{
transform:scale(1.08);
}

.experience-card:hover::after{
background:linear-gradient(to top,rgba(229,4,93,.82),rgba(13,20,29,.04) 70%);
}

.experience-overlay{
position:absolute;
left:28px;
right:28px;
bottom:28px;
z-index:2;
color:#fff;
}

.experience-overlay span{
display:block;
margin-bottom:8px;
font-size:.72rem;
font-weight:800;
letter-spacing:.1em;
text-transform:uppercase;
color:var(--yellow);
}

.experience-overlay h3{
font-family:"Barlow Condensed",sans-serif;
font-size:2.4rem;
font-weight:900;
line-height:.95;
text-transform:uppercase;
}

@media(max-width:1180px){
.week-grid{
grid-template-columns:repeat(4,1fr);
}
.day-card{
border-bottom:1px solid rgba(44,44,44,.15);
}
.day-card:nth-child(4){
border-right:0;
}
.experience-grid{
grid-template-columns:repeat(2,1fr);
}
}

@media(max-width:760px){
.weekly-events{
padding:65px 0 55px;
}
.week-grid{
grid-template-columns:1fr 1fr;
}
.day-card:nth-child(even){
border-right:0;
}
.day-card{
min-height:200px;
}
.experience-card{
height:320px;
}
}

@media(max-width:520px){
.week-grid,
.experience-grid{
grid-template-columns:1fr;
}
.day-card{
border-right:0;
}
.experience-card{
height:300px;
}
}

.about-section{
padding:110px 0;
background:#fff;
}

.about-grid{
display:grid;
grid-template-columns:1.05fr .95fr;
gap:90px;
align-items:center;
}

.about-images{
position:relative;
min-height:620px;
}

.about-main{
width:78%;
height:560px;
object-fit:cover;
border-radius:0 90px 0 90px;
box-shadow:var(--shadow);
}

.about-small{
position:absolute;
right:0;
bottom:0;
width:48%;
height:300px;
object-fit:cover;
border:10px solid #fff;
border-radius:60px 0 60px 0;
box-shadow:var(--shadow);
}

.about-badge{
position:absolute;
left:40px;
bottom:35px;
padding:18px 24px;
background:linear-gradient(135deg,var(--turquoise),var(--pink));
color:#fff;
box-shadow:0 18px 35px rgba(0,151,172,.28);
}

.about-badge strong,
.about-badge span{
display:block;
}

.about-badge strong{
font-family:"Barlow Condensed",sans-serif;
font-size:1.8rem;
text-transform:uppercase;
}

.about-badge span{
margin-top:4px;
font-size:.75rem;
font-weight:700;
text-transform:uppercase;
}

.about-copy h2{
margin:10px 0 24px;
font-family:"Barlow Condensed",sans-serif;
font-size:clamp(3rem,5vw,5rem);
font-weight:900;
line-height:.95;
text-transform:uppercase;
color:var(--turquoise-dark);
}

.about-copy p{
margin-bottom:18px;
line-height:1.9;
color:var(--muted);
}

.about-points{
display:grid;
grid-template-columns:1fr 1fr;
gap:16px 24px;
margin:34px 0 36px;
}

.about-points div{
display:flex;
align-items:center;
gap:11px;
font-weight:700;
}

.about-points i{
width:28px;
height:28px;
display:grid;
place-items:center;
border-radius:50%;
background:#fff0f6;
color:var(--pink);
font-size:.75rem;
}

.sunset-banner{
position:relative;
min-height:520px;
display:flex;
align-items:center;
background:url("../images/sunset-banner.jpg") center/cover no-repeat;
}

.sunset-overlay{
position:absolute;
inset:0;
background:linear-gradient(90deg,rgba(122,11,55,.82),rgba(255,96,33,.26),rgba(0,140,164,.12));
}

.sunset-copy{
position:relative;
z-index:2;
color:#fff;
}

.sunset-copy>span{
font-family:"Barlow Condensed",sans-serif;
font-size:clamp(3rem,6vw,6rem);
font-weight:300;
line-height:.9;
text-transform:uppercase;
}

.sunset-copy h2{
margin-top:-4px;
font-family:"Yellowtail",cursive;
font-size:clamp(4rem,7vw,7rem);
font-weight:400;
line-height:.85;
color:var(--yellow);
}

.sunset-copy p{
max-width:520px;
margin:26px 0 32px;
font-size:1.05rem;
font-weight:600;
line-height:1.7;
}

.gallery-section{
padding:100px 0;
background:linear-gradient(180deg,#fff,#fff6e7);
}

.gallery-grid{
display:grid;
grid-template-columns:repeat(4,1fr);
grid-auto-rows:260px;
gap:18px;
}

.gallery-item{
position:relative;
overflow:hidden;
border-radius:18px;
box-shadow:0 16px 35px rgba(28,44,53,.12);
}

.gallery-item::after{
content:"";
position:absolute;
inset:0;
background:linear-gradient(to top,rgba(238,13,104,.45),transparent 55%);
opacity:0;
transition:.3s;
}

.gallery-item:hover::after{
opacity:1;
}

.gallery-item img{
width:100%;
height:100%;
object-fit:cover;
transition:.55s;
}

.gallery-item:hover img{
transform:scale(1.07);
}

.gallery-item.tall{
grid-row:span 2;
}

.gallery-item.wide{
grid-column:span 2;
}

@media(max-width:980px){
.about-grid{
grid-template-columns:1fr;
gap:55px;
}
.about-images{
min-height:560px;
}
.gallery-grid{
grid-template-columns:repeat(2,1fr);
}
}

@media(max-width:620px){
.about-section{
padding:75px 0;
}
.about-images{
min-height:470px;
}
.about-main{
width:88%;
height:420px;
}
.about-small{
width:52%;
height:220px;
}
.about-badge{
left:20px;
bottom:20px;
}
.about-points{
grid-template-columns:1fr;
}
.sunset-banner{
min-height:460px;
}
.gallery-grid{
grid-template-columns:1fr;
grid-auto-rows:280px;
}
.gallery-item.tall,
.gallery-item.wide{
grid-row:auto;
grid-column:auto;
}
}

.booking-section{
padding:100px 0;
background:
linear-gradient(135deg,rgba(255,16,113,.94),rgba(255,123,29,.9)),
url("../images/booking-bg.jpg") center/cover;
}

.booking-grid{
display:grid;
grid-template-columns:.9fr 1.1fr;
gap:80px;
align-items:center;
}

.booking-copy{
color:#fff;
}

.booking-copy .section-kicker{
color:var(--yellow);
}

.booking-copy h2{
margin:10px 0 22px;
font-family:"Barlow Condensed",sans-serif;
font-size:clamp(3.2rem,5vw,5.4rem);
font-weight:900;
line-height:.92;
text-transform:uppercase;
}

.booking-copy p{
max-width:560px;
line-height:1.85;
}

.booking-details{
display:grid;
gap:16px;
margin-top:32px;
}

.booking-details div{
display:flex;
align-items:center;
gap:14px;
font-weight:700;
}

.booking-details i{
width:42px;
height:42px;
display:grid;
place-items:center;
border-radius:50%;
background:rgba(255,255,255,.15);
color:var(--yellow);
}

.booking-form{
padding:42px;
background:#fff;
border-radius:24px;
box-shadow:0 24px 55px rgba(97,0,41,.24);
}

.form-row{
display:grid;
grid-template-columns:1fr 1fr;
gap:18px;
}

.form-group{
margin-bottom:18px;
}

.form-group label{
display:block;
margin-bottom:8px;
font-size:.78rem;
font-weight:800;
text-transform:uppercase;
color:var(--turquoise-dark);
}

.form-group input,
.form-group select,
.form-group textarea{
width:100%;
border:1px solid #e6e0da;
border-radius:10px;
padding:15px 16px;
background:#fffaf4;
color:var(--ink);
outline:none;
transition:.25s;
}

.form-group input:focus,
.form-group select:focus,
.form-group textarea:focus{
border-color:var(--pink);
box-shadow:0 0 0 4px rgba(255,15,114,.09);
}

.form-group textarea{
resize:vertical;
}

.booking-form .btn{
width:100%;
border:0;
cursor:pointer;
}

.location-section{
padding:100px 0;
background:#fff;
}

.location-grid{
display:grid;
grid-template-columns:1.15fr .85fr;
gap:70px;
align-items:center;
}

.location-map{
overflow:hidden;
border-radius:28px;
box-shadow:var(--shadow);
}

.location-map iframe{
display:block;
width:100%;
height:590px;
border:0;
}

.location-copy h2{
margin:10px 0 22px;
font-family:"Barlow Condensed",sans-serif;
font-size:clamp(3rem,5vw,5rem);
font-weight:900;
line-height:.95;
text-transform:uppercase;
color:var(--turquoise-dark);
}

.location-copy>p{
line-height:1.85;
color:var(--muted);
}

.location-list{
display:grid;
gap:22px;
margin:34px 0;
}

.location-list>div{
display:flex;
align-items:flex-start;
gap:16px;
}

.location-list i{
width:48px;
height:48px;
display:grid;
place-items:center;
flex:0 0 auto;
border-radius:14px;
background:#fff0f6;
color:var(--pink);
}

.location-list strong,
.location-list span{
display:block;
}

.location-list strong{
margin-bottom:5px;
color:var(--ink);
}

.location-list span{
font-size:.9rem;
line-height:1.6;
color:var(--muted);
}

.location-actions{
display:flex;
gap:14px;
flex-wrap:wrap;
}

.btn-turquoise{
background:var(--turquoise);
color:#fff;
box-shadow:0 14px 30px rgba(0,174,189,.25);
}

.btn-turquoise:hover{
transform:translateY(-3px);
background:var(--turquoise-dark);
}

@media(max-width:900px){
.booking-grid,
.location-grid{
grid-template-columns:1fr;
gap:50px;
}
.location-map iframe{
height:440px;
}
}

@media(max-width:580px){
.booking-section,
.location-section{
padding:75px 0;
}
.booking-form{
padding:26px 20px;
}
.form-row{
grid-template-columns:1fr;
gap:0;
}
.location-map iframe{
height:360px;
}
.location-actions{
flex-direction:column;
}
.location-actions .btn{
width:100%;
}
}

.site-footer{
position:relative;
padding:140px 0 35px;
background:linear-gradient(135deg,#00a5b8,#ff0f72);
color:#fff;
overflow:hidden;
}

.footer-wave{
position:absolute;
top:0;
left:0;
width:100%;
line-height:0;
}

.footer-wave svg{
display:block;
width:100%;
height:90px;
}

.footer-grid{
display:grid;
grid-template-columns:2fr 1fr 1fr 1fr;
gap:70px;
}

.footer-brand img{
width:220px;
margin-bottom:28px;
}

.footer-brand p{
max-width:420px;
line-height:1.8;
margin-bottom:30px;
opacity:.95;
}

.footer-social{
display:flex;
gap:14px;
}

.footer-social a{
width:48px;
height:48px;
display:grid;
place-items:center;
border-radius:50%;
background:rgba(255,255,255,.15);
transition:.3s;
}

.footer-social a:hover{
background:#fff;
color:var(--pink);
transform:translateY(-5px);
}

.site-footer h4{
margin-bottom:24px;
font-size:1rem;
text-transform:uppercase;
letter-spacing:.08em;
}

.site-footer ul{
list-style:none;
}

.site-footer li{
margin-bottom:14px;
opacity:.95;
}

.site-footer li i{
width:20px;
}

.site-footer a{
transition:.25s;
}

.site-footer a:hover{
color:var(--yellow);
}

.footer-bottom{
margin-top:70px !important;
padding-top:30px !important;
border-top:1px solid rgba(255,255,255,.18);
display:flex;
justify-content:space-between;
align-items:center;
flex-wrap:wrap;
gap:20px;
font-size:.85rem;
    max-width: 1440px;
    padding-left: 20px;
    padding-right: 20px;
    margin: 0 auto;
}

.footer-bottom span{
margin:0 10px;
opacity:.5;
}

.floating-book,
.floating-whatsapp,
.back-top{
position:fixed;
right:26px;
width:58px;
height:58px;
border-radius:50%;
display:grid;
place-items:center;
text-decoration:none;
color:#fff;
box-shadow:0 18px 35px rgba(0,0,0,.25);
z-index:999;
transition:.3s;
}

.floating-book{
bottom:170px;
background:linear-gradient(135deg,var(--orange),var(--pink));
}

.floating-book span{
display:none;
}

.floating-whatsapp{
bottom:100px;
background:#25D366;
font-size:1.45rem;
}

.back-top{
bottom:28px;
border:0;
cursor:pointer;
background:var(--turquoise);
opacity:0;
visibility:hidden;
transform:translateY(12px);
}

.back-top.show{
opacity:1;
visibility:visible;
transform:none;
}

.floating-book:hover,
.floating-whatsapp:hover,
.back-top:hover{
transform:translateY(-5px);
}

@media(max-width:980px){

.footer-grid{
grid-template-columns:1fr;
gap:40px;
}

.footer-bottom{
flex-direction:column;
text-align:center;
}

.floating-book{
bottom:160px;
right:18px;
}

.floating-whatsapp{
bottom:90px;
right:18px;
}

.back-top{
bottom:18px;
right:18px;
}

}

.back-to-top {
    position: fixed;
    right: 30px;
    bottom: 30px;
    z-index: 1000;

    display: grid;
    width: 55px;
    height: 55px;
    place-items: center;

    border: 0;
    border-radius: 50%;

    color: #fff;
    background: linear-gradient(135deg, var(--turquoise), var(--pink));
    box-shadow: 0 14px 32px rgba(0, 0, 0, 0.22);

    cursor: pointer;
    opacity: 0;
    visibility: hidden;
    transform: translateY(14px);

    transition:
        opacity 0.25s ease,
        visibility 0.25s ease,
        transform 0.25s ease,
        box-shadow 0.25s ease;
}

.back-to-top.show {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
}

.back-to-top:hover {
    transform: translateY(-4px);
    box-shadow: 0 18px 38px rgba(0, 0, 0, 0.28);
}

.back-to-top i {
    font-size: 0.95rem;
}

@media (max-width: 600px) {
    .back-to-top {
        right: 20px;
        bottom: 20px;
        width: 55px;
        height: 55px;
    }
}