/*
Theme Name: SuguCu
Theme URI: https://sugucu.com
Author: SuguCu
Description: The SuguCu brand theme. Sugar Curate. Where everyone's looking.
Version: 1.0
Requires PHP: 7.4
Text Domain: sugucu
*/

:root{--teal:#2A9D8E;--dark:#264653;--gold:#E9C46B;--mango:#F3A261;--coral:#E66F51;--silver:#AEBFC6;--cream:#FAF7F0;--muted:rgba(38,70,83,.62)}
*{box-sizing:border-box}
html{scroll-behavior:smooth;background:var(--cream)}
body{margin:0;background:transparent;font-family:Inter,-apple-system,'Segoe UI',Roboto,sans-serif;color:var(--dark);font-size:16px;line-height:1.5}
h1,h2,h3,h4{font-family:Poppins,sans-serif;font-weight:700;letter-spacing:-0.01em;color:var(--dark);line-height:1.15}
h1{font-size:clamp(34px,6vw,58px)}h2{font-size:clamp(24px,3.4vw,34px)}h3{font-size:18px}
a{color:var(--teal)}
img{max-width:100%;height:auto}
.wrap{max-width:1080px;margin:0 auto;padding:0 20px}

/* Shapes we own */
.dot{border-radius:50%;background:radial-gradient(circle at 38% 30%,#E66F51 0 11%,#F3A261 11% 26%,#E9C46B 26% 46%,#2A9D8E 46% 100%)}
.stick{display:block;width:64px;height:6px;border-radius:999px;background:var(--coral);transform:rotate(-15deg);margin:18px 0;animation:sway 6s ease-in-out infinite}
@keyframes sway{0%,100%{transform:rotate(-15deg)}50%{transform:rotate(-11deg)}}
.pill,button.pill,a.pill{display:inline-block;border:0;border-radius:999px;padding:15px 32px;font-family:Poppins,sans-serif;font-weight:600;font-size:15px;cursor:pointer;text-decoration:none;text-align:center}
.pill-coral{background:var(--coral);color:#fff;box-shadow:0 6px 18px rgba(230,111,81,.35);animation:breathe 5s ease-in-out infinite}
.pill-coral:hover{color:#fff}
@keyframes breathe{0%,100%{box-shadow:0 6px 18px rgba(230,111,81,.35)}50%{box-shadow:0 6px 30px rgba(230,111,81,.55)}}
.pill-teal{background:var(--teal);color:#fff}.pill-teal:hover{color:#fff}
.pill-ghost{background:none;border:2px solid var(--dark);color:var(--dark);padding:13px 30px}
.chip{display:inline-block;font-family:Poppins,sans-serif;font-weight:600;font-size:11px;text-transform:uppercase;letter-spacing:.05em;color:var(--dark);border-radius:999px;padding:5px 15px}

/* Header */
.hd{position:sticky;top:0;z-index:60;background:rgba(250,247,240,.92);backdrop-filter:blur(9px);border-bottom:1px solid rgba(38,70,83,.08)}
.hd-in{max-width:1080px;margin:0 auto;display:flex;align-items:center;gap:22px;padding:14px 20px}
.logo{font-family:Poppins,sans-serif;font-weight:700;font-size:21px;color:var(--dark);text-decoration:none;display:flex;align-items:center;gap:10px}
.logo .dot{width:20px;height:20px;animation:bob 5s ease-in-out infinite}
@keyframes bob{0%,100%{transform:translateY(0)}50%{transform:translateY(-3px)}}
.nav{display:flex;gap:20px;margin-left:auto;align-items:center;flex-wrap:wrap}
.nav a{color:var(--dark);text-decoration:none;font-size:14px;font-weight:500}
.nav a:hover{color:var(--teal)}
.nav .pill-coral{padding:10px 22px;animation:breathe 5s ease-in-out infinite}

/* Ambient candy dots */
.amb{position:absolute;pointer-events:none;opacity:.85}
.amb .dot{position:absolute;animation:drift 7s ease-in-out infinite}
@keyframes drift{0%,100%{transform:translate(0,0) scale(1)}33%{transform:translate(6px,-10px) scale(1.05)}66%{transform:translate(-5px,6px) scale(.96)}}

/* Hero */
.hero{position:relative;padding:34px 0 8px;overflow:hidden}
.hero .kicker{display:inline-flex;align-items:center;gap:9px;background:#fff;border-radius:999px;padding:8px 18px;font-family:Poppins,sans-serif;font-weight:600;font-size:12px;letter-spacing:.06em;text-transform:uppercase;color:var(--muted);box-shadow:0 2px 10px rgba(38,70,83,.08);animation:glow 6s ease-in-out infinite}
@keyframes glow{0%,100%{box-shadow:0 2px 10px rgba(38,70,83,.08)}50%{box-shadow:0 2px 18px rgba(233,196,107,.55)}}
.hero .kicker .dot{width:12px;height:12px}
.hero p.lead{font-size:18px;max-width:560px;color:var(--dark)}
.hero .ctas{display:flex;gap:14px;flex-wrap:wrap;margin-top:22px}

/* Screen frame 16:9 mock-ad loop */
.frame{width:100%;aspect-ratio:16/9;border-radius:16px;overflow:hidden;position:relative;background:var(--dark);box-shadow:0 18px 48px rgba(38,70,83,.25)}
.frame .slide{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:6%;opacity:0;transition:opacity 1.1s ease}
.frame .slide.on{opacity:1}
.frame .slide .big{font-family:Poppins,sans-serif;font-weight:700;font-size:clamp(20px,4vw,42px);color:#fff;line-height:1.1}
.frame .slide .sub{font-family:Poppins,sans-serif;font-weight:600;font-size:clamp(12px,1.8vw,18px);color:rgba(255,255,255,.85);margin-top:10px}
.frame .bar{position:absolute;left:0;bottom:0;height:4px;background:var(--gold);width:0;z-index:5}
.frame .bar.run{animation:bar 4s linear infinite}
@keyframes bar{from{width:0}to{width:100%}}
.frame-cap{text-align:center;font-size:13px;color:var(--muted);margin-top:12px}

/* Cards */
.cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:18px;margin:10px 0}
.card{background:#fff;border-radius:16px;padding:26px;box-shadow:0 2px 12px rgba(38,70,83,.08);transition:transform .25s,box-shadow .25s}
.card:hover{transform:translateY(-4px);box-shadow:0 10px 26px rgba(38,70,83,.14)}
.card .dot{width:14px;height:14px;margin-bottom:14px;animation:drift 7s ease-in-out infinite}
.card h3 em{font-style:normal;color:var(--coral)}
.card .sub{font-size:13px;color:var(--muted);font-family:Poppins,sans-serif;font-weight:500;letter-spacing:.02em}

/* Pricing */
.tiers{display:flex;flex-wrap:wrap;justify-content:center;gap:18px;margin:24px 0}
.tier{background:#fff;border-radius:16px;padding:26px;box-shadow:0 2px 12px rgba(38,70,83,.08);display:flex;flex-direction:column;flex:1 1 260px;max-width:340px}\n.tier .pill{align-self:center;min-width:210px;margin-top:auto}
.tier .price{font-family:Poppins,sans-serif;font-weight:700;font-size:30px;margin:8px 0 2px}
.tier .per{font-size:12px;color:var(--muted)}
.tier ul{margin:14px 0 18px;padding:0;list-style:none;flex:1}
.tier li{font-size:14px;padding:4px 0 4px 24px;position:relative}
.tier li:before{content:'';position:absolute;left:0;top:9px;width:12px;height:12px;border-radius:50%;background:radial-gradient(circle at 38% 30%,#E66F51 0 11%,#F3A261 11% 26%,#E9C46B 26% 46%,#2A9D8E 46% 100%)}
.strip-label{font-family:Poppins,sans-serif;font-weight:600;font-size:14px;text-transform:uppercase;letter-spacing:.05em;color:var(--muted);margin:30px 0 0}

/* Availability checker */
.avail{background:#fff;border-radius:16px;padding:28px;box-shadow:0 2px 12px rgba(38,70,83,.08)}
.avail select{padding:12px 14px;border:1px solid #ccd;border-radius:10px;font-family:Inter,sans-serif;font-size:15px;min-width:230px}
.avail .dates{display:flex;flex-wrap:wrap;gap:8px;margin-top:16px}
.avail .d{border:1px solid var(--teal);color:var(--teal);background:#fff;border-radius:999px;padding:9px 18px;font-size:14px;text-decoration:none;font-weight:500}
.avail .d:hover{background:var(--teal);color:#fff}
.loaderdots{display:inline-flex;gap:6px;margin-left:8px}
.loaderdots i{width:9px;height:9px;border-radius:50%;background:radial-gradient(circle at 38% 30%,#E66F51 0 11%,#F3A261 11% 26%,#E9C46B 26% 46%,#2A9D8E 46% 100%);animation:hop 1s ease-in-out infinite}
.loaderdots i:nth-child(2){animation-delay:.15s}.loaderdots i:nth-child(3){animation-delay:.3s}
@keyframes hop{0%,100%{transform:translateY(0)}40%{transform:translateY(-7px)}}

/* Steps */
.steps{display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:18px;margin:24px 0}
.step{background:#fff;border-radius:16px;padding:24px;box-shadow:0 2px 12px rgba(38,70,83,.08)}
.step .n{width:34px;height:34px;border-radius:50%;background:var(--teal);color:#fff;font-family:Poppins,sans-serif;font-weight:700;display:flex;align-items:center;justify-content:center;margin-bottom:12px}
.step p{font-size:14px;color:var(--muted);margin:6px 0 0}

/* Sections + CTA band */
section{padding:26px 0}
.band{background:var(--dark);border-radius:20px;padding:52px 30px;text-align:center;position:relative;overflow:hidden}
.band h2{color:#fff}
.band p{color:rgba(255,255,255,.8);max-width:520px;margin:10px auto 24px}

/* Footer */
.ft{border-top:1px solid rgba(38,70,83,.08);margin-top:32px;padding:30px 20px;text-align:center;font-size:13px;color:var(--muted)}
.ft a{color:var(--muted)}

/* Content pages */
.content{max-width:860px;margin:0 auto;padding:34px 20px}
.content .entry-title{margin-top:8px}
body.page-id-18 .entry-title,body.page-id-19 .entry-title{display:none}
.content p,.content li{font-size:16px;max-width:70ch}

/* Woo skin (screen 4) */
.woocommerce{max-width:960px;margin:0 auto;padding:0 16px}
.woocommerce form .form-row input.input-text,.woocommerce form .form-row textarea,.woocommerce form .form-row select{padding:11px 13px;border:1px solid #ccd;border-radius:10px;font-family:Inter,sans-serif}
.woocommerce form .form-row label{font-size:13px;font-weight:500}
#customer_details,.woocommerce-checkout-review-order,.woocommerce form.login,.woocommerce form.register{background:#fff;border-radius:16px;padding:22px;box-shadow:0 2px 10px rgba(38,70,83,.08);border:0}
#place_order,.woocommerce button.button.alt{background:var(--coral)!important;color:#fff!important;border:0!important;border-radius:999px!important;padding:14px 30px!important;font-family:Poppins,sans-serif!important;font-weight:600!important;box-shadow:0 4px 14px rgba(230,111,81,.35)}
.woocommerce button.button,.woocommerce a.button{background:var(--teal);color:#fff;border-radius:999px;font-family:Poppins,sans-serif;font-weight:600}
.woocommerce table.shop_table{border:0;background:#fff;border-radius:12px;overflow:hidden}
.woocommerce table.shop_table th{background:var(--dark);color:#fff}
.woocommerce-info,.woocommerce-message{border-top-color:var(--teal)}
.woocommerce-error{border-top-color:var(--coral)}

@media (max-width:720px){.nav{gap:12px}.nav a{font-size:13px}.hero{padding:20px 0 6px}}
@media (prefers-reduced-motion:reduce){
.stick,.logo .dot,.pill-coral,.nav .pill-coral,.hero .kicker,.amb .dot,.card .dot,.loaderdots i,.bglogo .bl,.hero-logo img{animation:none!important}
.frame .slide{transition:none}
.frame .bar{display:none}
}

/* Infinite background logos */
.bglogo{position:fixed;inset:0;pointer-events:none;z-index:-1;overflow:hidden}
.bglogo .bl{position:absolute;height:auto;transform-origin:50% 62%;animation:lollisway 8s ease-in-out infinite}
@keyframes lollisway{0%,100%{transform:rotate(-3.5deg)}50%{transform:rotate(3.5deg)}}
.bglogo .bl:nth-of-type(1){width:250px;top:14%;left:2%;opacity:.07;animation-duration:9s}
.bglogo .bl:nth-of-type(2){width:120px;top:6%;left:38%;opacity:.05;animation-duration:12s;animation-delay:1.2s}
.bglogo .bl:nth-of-type(3){width:170px;top:10%;right:4%;opacity:.06;animation-duration:10s;animation-delay:2.4s}
.bglogo .bl:nth-of-type(4){width:80px;top:38%;left:22%;opacity:.045;animation-duration:13s;animation-delay:.8s}
.bglogo .bl:nth-of-type(5){width:210px;top:42%;right:12%;opacity:.06;animation-duration:11s;animation-delay:3.6s}
.bglogo .bl:nth-of-type(6){width:100px;top:56%;left:5%;opacity:.05;animation-duration:14s;animation-delay:4.4s}
.bglogo .bl:nth-of-type(7){width:64px;top:64%;right:34%;opacity:.045;animation-duration:9.5s;animation-delay:2s}
.bglogo .bl:nth-of-type(8){width:190px;bottom:6%;left:16%;opacity:.06;animation-duration:12.5s;animation-delay:5.2s}
.bglogo .bl:nth-of-type(9){width:140px;bottom:10%;right:3%;opacity:.055;animation-duration:10.5s;animation-delay:1.6s}
.bglogo .bl:nth-of-type(10){width:90px;bottom:26%;left:44%;opacity:.045;animation-duration:15s;animation-delay:6s}
@keyframes floaty{0%,100%{transform:translateY(0) rotate(0deg)}50%{transform:translateY(-20px) rotate(3deg)}}

/* Hero flex: text beside logo */
.hero-flex{display:flex;align-items:center;gap:36px;flex-wrap:wrap}
.hero-txt{flex:1 1 420px;min-width:290px}
.hero-logo{flex:0 1 auto;margin:0 auto}
.hero-logo img{width:min(320px,58vw);height:auto;animation:floaty 9s ease-in-out infinite}

/* My Account sign-in: centered */
.woocommerce-account .woocommerce > h2{text-align:center}
.woocommerce-account form.woocommerce-form-login{max-width:420px;margin:0 auto}