/* ==========================================================================
   PINKBERRY AUSTRIA — Official Brand Style Guide Compliant

   OFFICIAL COLORS (from Style Guide PMS):
   Pink: #EA7F84 (PMS 709, RGB 234/127/132) — accent only
   Green: #91C850 (PMS 376, RGB 145/200/80) — accent only
   White: dominant color in all compositions
   Copy: 80% black (#333)

   TYPOGRAPHY (matching pinkberryworld.com — Adobe Typekit):
   Headlines: Futura PT (via Adobe Fonts)
   Body: Acumin Pro (via Adobe Fonts)
   All headlines: lowercase, center-aligned, no punctuation
   Body: sentence case, center-aligned
   Headline:body ratio = 3:1
   ========================================================================== */

/* Reset */
*, *::before, *::after { margin:0; padding:0; box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { font-family:'acumin-pro', 'Source Sans 3', sans-serif; color:#333; line-height:1.7; background:#fff; overflow-x:hidden; font-weight:300; }
a { text-decoration:none; color:inherit; transition:color 0.3s; }
img { max-width:100%; height:auto; display:block; }
ul { list-style:none; }

/* Utilities */
.container { max-width:1200px; margin:0 auto; padding:0 28px; }
.text-center { text-align:center; }
.section { padding:100px 0; }
.section-alt { background:#fafafa; }
.divider { width:48px; height:3px; background:#EA7F84; margin:16px auto 0; }

/* Typography — per brand guidelines: all UPPERCASE headlines (matching pinkberryworld.com) */
h1, h2, h3, h4 { font-family:'futura-pt', 'Jost', sans-serif; color:#333; line-height:1.2; font-weight:700; text-transform:uppercase; }
h2 { font-size:2.6rem; letter-spacing:0.5px; }
h3 { font-size:1.4rem; font-weight:600; }
.section-label { display:inline-block; font-size:0.75rem; font-weight:600; letter-spacing:3px; text-transform:uppercase; color:#91C850; margin-bottom:12px; }
.section-desc { font-size:1.05rem; color:#666; max-width:560px; margin:20px auto 0; font-weight:300; line-height:1.8; }

/* Buttons — rounded pill style */
.btn { display:inline-block; padding:16px 44px; border-radius:50px; font-weight:600; font-size:0.85rem; letter-spacing:2px; text-transform:uppercase; font-family:'futura-pt', 'Jost', sans-serif; border:none; cursor:pointer; transition:all 0.35s cubic-bezier(0.4,0,0.2,1); }
.btn-pink { background:#EA7F84; color:#fff; }
.btn-pink:hover { background:#d96b70; transform:translateY(-3px); box-shadow:0 12px 32px rgba(234,127,132,0.25); }
.btn-white { background:#fff; color:#333; border:2px solid #eee; }
.btn-white:hover { border-color:#EA7F84; color:#EA7F84; transform:translateY(-3px); box-shadow:0 12px 32px rgba(0,0,0,0.06); }
.btn-outline { background:transparent; color:#EA7F84; border:2px solid #EA7F84; padding:14px 40px; }
.btn-outline:hover { background:#EA7F84; color:#fff; transform:translateY(-3px); }
.btn-green { background:#91C850; color:#fff; }
.btn-green:hover { background:#7db340; transform:translateY(-3px); }
.btn-dark { background:#333; color:#fff; }
.btn-dark:hover { background:#555; transform:translateY(-3px); }

/* ===== NAVBAR — clean white, minimal ===== */
.navbar { position:fixed; top:0; left:0; right:0; z-index:1000; background:rgba(255,255,255,0.98); backdrop-filter:blur(20px); -webkit-backdrop-filter:blur(20px); transition:box-shadow 0.3s; }
.navbar.scrolled { box-shadow:0 1px 30px rgba(0,0,0,0.06); }
.nav-inner { max-width:1200px; margin:0 auto; padding:0 28px; display:flex; align-items:center; justify-content:space-between; height:72px; position:relative; }
.nav-logo img { height:44px; }
.nav-links { display:flex; align-items:center; gap:24px; flex-shrink:0; }
.nav-links a { font-size:0.8rem; font-weight:500; letter-spacing:1.5px; text-transform:uppercase; color:#333; position:relative; }
.nav-links a:hover, .nav-links a.active { color:#91C850; }
.nav-links a::after { content:''; position:absolute; bottom:-4px; left:0; width:0; height:2px; background:#91C850; transition:width 0.3s; }
.nav-links a:hover::after, .nav-links a.active::after { width:100%; }
.nav-cta { background:#91C850; color:#fff !important; padding:8px 20px; border-radius:50px; font-weight:600; font-size:0.7rem; }
.nav-cta::after { display:none !important; }
.nav-cta:hover { background:#7db340; color:#fff !important; }
.menu-toggle { display:none; background:none; border:none; font-size:1.6rem; cursor:pointer; color:#333; padding:8px; }

/* Language Toggle */
.lang-toggle { background:#fff; border:2px solid #333; color:#333; font-size:0.65rem; font-weight:700; letter-spacing:1px; text-transform:uppercase; padding:5px 12px; border-radius:50px; cursor:pointer; font-family:'futura-pt','Jost',sans-serif; transition:all 0.3s; margin-left:12px; flex-shrink:0; }
.lang-toggle:hover { border-color:#EA7F84; color:#EA7F84; background:#fff; }

/* ===== HERO — product hero with falling fruits ===== */
.hero { min-height:85vh; display:flex; align-items:center; justify-content:center; position:relative; overflow:hidden; background:#fff; }
.hero-inner { display:grid; grid-template-columns:1fr 1.2fr; gap:50px; align-items:center; max-width:1400px; margin:0 auto; padding:110px 28px 70px; width:100%; }
.hero-text { text-align:left; }
.hero-text h1 { font-size:4rem; font-weight:700; color:#333; line-height:1.1; margin-bottom:20px; text-transform:uppercase; }
.hero-text .hero-sub { font-size:1.2rem; color:#666; font-weight:300; margin-bottom:36px; line-height:1.7; }
.hero-text .hero-btns { display:flex; gap:16px; flex-wrap:wrap; }
.hero-image { position:relative; flex-shrink:0; opacity:0; animation:hero-img-fadein 1.8s ease-out 0.4s forwards; }
@keyframes hero-img-fadein {
    0% { opacity:0; transform:translateX(60px) scale(0.95); }
    100% { opacity:1; transform:translateX(0) scale(1); }
}
.hero-product-scene { position:relative; overflow:visible; max-width:58%; margin:0 auto 0 15%; }
.hero-product-scene .hero-cup {
    width:100%; display:block; position:relative; z-index:1;
    filter:drop-shadow(0 20px 40px rgba(0,0,0,0.12));
    transition:transform 0.6s cubic-bezier(0.25,0.46,0.45,0.94), filter 0.6s ease;
    animation:cup-float 5s ease-in-out infinite;
}
@keyframes cup-float {
    0%, 100% { transform:translateY(0); }
    50% { transform:translateY(-15px); }
}

/* 3D tilt on hover */
.hero-product-scene:hover .hero-cup {
    transform:perspective(800px) rotateY(-4deg) rotateX(2deg) scale(1.02);
    filter:drop-shadow(0 30px 50px rgba(0,0,0,0.18));
    animation-play-state:paused;
}

/* Hero glow — soft pink ambient light */
.hero-glow {
    display:block;
    position:absolute;
    width:140%;
    height:140%;
    top:-20%;
    left:-20%;
    background:radial-gradient(ellipse at center, rgba(234,127,132,0.1) 0%, transparent 60%);
    z-index:0;
    pointer-events:none;
    animation:glow-pulse 4s ease-in-out infinite alternate;
}
@keyframes glow-pulse {
    0% { opacity:0.6; transform:scale(1); }
    100% { opacity:1; transform:scale(1.05); }
}
/* ===== PRODUCT SHOWCASE ===== */
.showcase { padding:100px 0; background:#fff; }
.showcase-grid { display:grid; grid-template-columns:repeat(3, 1fr); gap:28px; margin-top:56px; }
.showcase-card { position:relative; border-radius:20px; overflow:hidden; background:#fff; box-shadow:0 2px 20px rgba(0,0,0,0.04); border:1px solid #f0f0f0; transition:all 0.4s cubic-bezier(0.4,0,0.2,1); }
.showcase-card:hover { transform:translateY(-8px); box-shadow:0 20px 60px rgba(0,0,0,0.08); }
.showcase-card-img { width:100%; aspect-ratio:1/1; object-fit:cover; transition:transform 0.6s cubic-bezier(0.4,0,0.2,1); }
.showcase-card:hover .showcase-card-img { transform:scale(1.05); }
.showcase-card-body { padding:24px 24px 28px; text-align:center; }
.showcase-card-body h3 { font-size:1.15rem; margin-bottom:4px; font-weight:600; letter-spacing:0.3px; text-transform:uppercase; }
.showcase-card-body p { font-size:0.88rem; color:#999; font-weight:300; }
.showcase-card-tag { position:absolute; top:16px; left:16px; background:#91C850; color:#fff; padding:5px 14px; border-radius:50px; font-size:0.7rem; font-weight:600; letter-spacing:1px; text-transform:uppercase; }

/* ===== FEATURE STRIP ===== */
.feature-strip { background:#fafafa; padding:64px 0; border-top:1px solid #f0f0f0; border-bottom:1px solid #f0f0f0; }
.feature-strip-inner { display:flex; justify-content:center; gap:80px; flex-wrap:wrap; max-width:1200px; margin:0 auto; padding:0 28px; }
.feature-item { text-align:center; }
.feature-item .num { font-family:'futura-pt', 'Jost', sans-serif; font-size:2.8rem; font-weight:700; color:#91C850; }
.feature-item .label { font-size:0.8rem; letter-spacing:2px; text-transform:uppercase; color:#999; margin-top:4px; font-weight:400; }

/* ===== ABOUT TEASER ===== */
.about-teaser { padding:100px 0; background:#fff; }
.about-teaser-inner { display:grid; grid-template-columns:1fr 1fr; gap:80px; align-items:center; }
.about-teaser-img { border-radius:24px; overflow:hidden; }
.about-teaser-img img { width:100%; height:100%; object-fit:cover; min-height:420px; }
.about-teaser-text h2 { margin-bottom:20px; }
.about-teaser-text p { color:#666; font-size:1.05rem; line-height:1.9; margin-bottom:16px; font-weight:300; }
.about-teaser-text .btn { margin-top:12px; }

/* ===== TOPPINGS SECTION ===== */
.toppings-section { padding:100px 0; background:#fafafa; }
.toppings-grid { display:grid; grid-template-columns:repeat(4, 1fr); gap:20px; margin-top:56px; }
.topping-card { background:#fff; border-radius:16px; overflow:hidden; text-align:center; border:1px solid #f0f0f0; transition:all 0.3s; }
.topping-card:hover { transform:translateY(-4px); box-shadow:0 12px 36px rgba(0,0,0,0.06); }
.topping-card img { width:100%; aspect-ratio:1/1; object-fit:cover; }
.topping-card p { padding:14px; font-weight:500; font-size:0.88rem; color:#555; letter-spacing:0.5px; text-transform:uppercase; }

/* ===== VISIT / LOCATION ===== */
.visit-section { padding:100px 0; background:#fff; }
.visit-grid { display:grid; grid-template-columns:repeat(3, 1fr); gap:48px; margin-top:56px; }
.visit-card { text-align:left; }
.visit-card h3 { font-size:0.8rem; font-weight:600; color:#91C850; letter-spacing:2.5px; text-transform:uppercase; margin-bottom:16px; }
.visit-card p { color:#666; line-height:1.9; font-size:0.95rem; margin-bottom:14px; font-weight:300; }
.visit-card a.link { color:#EA7F84; font-weight:600; font-size:0.9rem; }
.visit-card a.link:hover { text-decoration:underline; }

/* ===== INSTAGRAM CTA ===== */
.insta-cta { padding:80px 0; background:#fafafa; text-align:center; border-top:1px solid #f0f0f0; }
.insta-cta h2 { color:#333; margin-bottom:12px; }
.insta-cta p { color:#666; font-size:1.05rem; font-weight:300; margin-bottom:32px; }

/* ===== PAGE HERO (sub-pages) — white with accent ===== */
.page-hero { padding:160px 28px 72px; text-align:center; background:#fff; position:relative; overflow:hidden; border-bottom:1px solid #f0f0f0; }
.page-hero::before { content:''; position:absolute; top:-100px; right:-100px; width:300px; height:300px; background:#91C850; border-radius:50%; opacity:0.06; }
.page-hero::after { content:''; position:absolute; bottom:-80px; left:-80px; width:200px; height:200px; background:#EA7F84; border-radius:50%; opacity:0.06; }
.page-hero h1 { font-size:3.2rem; font-weight:700; color:#333; letter-spacing:1px; position:relative; z-index:1; text-transform:uppercase; }
.page-hero p { color:#666; font-size:1.15rem; margin-top:14px; font-weight:300; position:relative; z-index:1; }

/* ===== FLAVORS PAGE ===== */
.flavors-grid { display:grid; grid-template-columns:repeat(3, 1fr); gap:32px; }
.flavor-card { background:#fff; border-radius:20px; overflow:hidden; box-shadow:0 2px 20px rgba(0,0,0,0.04); border:1px solid #f0f0f0; transition:all 0.4s cubic-bezier(0.4,0,0.2,1); }
.flavor-card:hover { transform:translateY(-8px); box-shadow:0 20px 60px rgba(0,0,0,0.08); }
.flavor-card img { width:100%; aspect-ratio:4/3; object-fit:cover; transition:transform 0.6s; }
.flavor-card:hover img { transform:scale(1.05); }
.flavor-card-body { padding:24px; text-align:center; }
.flavor-card-body h3 { font-size:1.15rem; font-weight:600; margin-bottom:4px; text-transform:uppercase; }
.flavor-card-body .flavor-tag { color:#EA7F84; font-size:0.85rem; font-weight:500; margin-bottom:8px; }
.flavor-card-body p { color:#888; font-size:0.9rem; line-height:1.7; font-weight:300; }

/* Toppings categories */
.topping-category { background:#fff; padding:32px; border-radius:16px; border:1px solid #f0f0f0; text-align:center; }
.topping-category h3 { color:#91C850; font-size:0.9rem; font-weight:700; text-transform:uppercase; letter-spacing:1.5px; margin-bottom:14px; }
.topping-category p { color:#666; font-size:0.95rem; line-height:1.8; font-weight:300; }

/* ===== STORY PAGE ===== */
.story-section { padding:100px 0; }
.story-content { max-width:780px; margin:0 auto; text-align:center; }
.story-content h2 { font-size:2rem; margin-bottom:24px; }
.story-content p { color:#666; font-size:1.05rem; line-height:1.95; margin-bottom:20px; font-weight:300; }
.story-values { background:#fafafa; border-radius:20px; padding:48px; margin:48px 0; text-align:center; border:1px solid #f0f0f0; }
.story-values h3 { color:#91C850; font-size:1.2rem; margin-bottom:28px; text-transform:uppercase; }
.story-value-item { margin-bottom:20px; }
.story-value-item h4 { font-weight:700; color:#333; margin-bottom:4px; font-size:1rem; text-transform:uppercase; }
.story-value-item p { color:#666; font-size:0.95rem; font-weight:300; }
.press-grid { display:grid; grid-template-columns:repeat(4, 1fr); gap:32px; align-items:start; }
.press-item { text-align:center; }
.press-item .quote { font-style:italic; color:#666; font-size:0.92rem; margin-bottom:8px; line-height:1.6; }
.press-item .source { font-weight:700; color:#bbb; font-size:0.82rem; letter-spacing:0.5px; }

/* ===== CONTACT PAGE ===== */
.contact-grid { display:grid; grid-template-columns:1fr 1fr; gap:72px; align-items:start; }
.contact-form { display:grid; gap:20px; }
.form-group label { display:block; font-weight:600; font-size:0.85rem; color:#555; margin-bottom:8px; letter-spacing:0.5px; text-transform:uppercase; }
.form-group input, .form-group textarea { width:100%; padding:14px 18px; border:2px solid #eee; border-radius:12px; font-family:'futura-pt', 'Jost', sans-serif; font-size:0.95rem; transition:border-color 0.3s; background:#fafafa; font-weight:300; }
.form-group input:focus, .form-group textarea:focus { outline:none; border-color:#91C850; background:#fff; }
.form-group textarea { resize:vertical; min-height:140px; }
.contact-info-block { margin-bottom:32px; }
.contact-info-block h3 { color:#91C850; font-size:0.85rem; font-weight:600; text-transform:uppercase; letter-spacing:2px; margin-bottom:10px; }
.contact-info-block p { color:#666; line-height:1.9; font-size:0.95rem; font-weight:300; }
.contact-info-block a { color:#EA7F84; font-weight:500; }
.contact-info-block a:hover { text-decoration:underline; }
.social-row { display:flex; gap:20px; }
.social-row a { color:#EA7F84; font-weight:600; font-size:0.9rem; }

/* Map */
.map-section { width:100%; }
.map-section iframe { width:100%; height:420px; border:0; display:block; }

/* ===== FOOTER ===== */
.footer { background:#333; color:#999; padding:72px 0 36px; }
.footer-grid { display:grid; grid-template-columns:1.4fr 1fr 1fr 1fr; gap:48px; margin-bottom:56px; }
.footer-brand p { margin-top:16px; font-size:0.82rem; color:#888; font-weight:300; line-height:1.7; }
.footer h4 { color:#fff; font-size:0.72rem; font-weight:600; letter-spacing:2.5px; text-transform:uppercase; margin-bottom:20px; }
.footer a { display:block; color:#888; font-size:0.88rem; margin-bottom:12px; font-weight:300; }
.footer a:hover { color:#91C850; }
.footer p { font-size:0.88rem; font-weight:300; margin-bottom:6px; }
.footer-bottom { border-top:1px solid #444; padding-top:28px; display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:12px; }
.footer-bottom p { font-size:0.75rem; color:#777; letter-spacing:0.5px; margin:0; }
.footer-bottom-links { display:flex; gap:24px; }
.footer-bottom-links a { font-size:0.75rem; color:#777; margin:0; }

/* ===== STORE GALLERY ===== */
.store-gallery img { transition:transform 0.6s cubic-bezier(0.4,0,0.2,1); }
.store-gallery img:hover { transform:scale(1.03); }

/* ===== CRAVING BANNER ===== */
.craving-banner { background:linear-gradient(135deg, #EA7F84 0%, #e8959a 40%, #f4b8bb 100%); padding:100px 0; text-align:center; position:relative; overflow:hidden; }
.craving-banner::before { content:''; position:absolute; top:-60px; right:-60px; width:250px; height:250px; background:rgba(255,255,255,0.1); border-radius:50%; }
.craving-banner::after { content:''; position:absolute; bottom:-40px; left:-40px; width:180px; height:180px; background:rgba(255,255,255,0.08); border-radius:50%; }
.craving-inner { max-width:700px; margin:0 auto; padding:0 28px; position:relative; z-index:1; }
.craving-text h2 { color:#fff; font-size:2.6rem; margin-bottom:20px; text-transform:uppercase; }
.craving-text p { color:rgba(255,255,255,0.9); font-size:1.15rem; line-height:1.8; font-weight:300; margin-bottom:36px; }
.craving-text .btn-white { background:#fff; color:#EA7F84; border:none; font-weight:700; }
.craving-text .btn-white:hover { background:rgba(255,255,255,0.9); transform:translateY(-3px); box-shadow:0 12px 40px rgba(0,0,0,0.15); }

/* ===== MARQUEE TICKER ===== */
.marquee-strip { background:#91C850; padding:14px 0; overflow:hidden; white-space:nowrap; }
.marquee-track { display:inline-block; animation:marquee 25s linear infinite; }
.marquee-track span { display:inline-block; padding:0 48px; font-size:0.8rem; font-weight:600; letter-spacing:3px; text-transform:uppercase; color:#fff; }
@keyframes marquee { 0% { transform:translateX(0); } 100% { transform:translateX(-50%); } }

/* ===== ANIMATIONS ===== */
.reveal { opacity:0; transform:translateY(24px); transition:opacity 0.7s cubic-bezier(0.16,1,0.3,1), transform 0.7s cubic-bezier(0.16,1,0.3,1); }
.reveal.visible { opacity:1; transform:translateY(0); }

@keyframes fadeInUp { from { opacity:0; transform:translateY(24px); } to { opacity:1; transform:translateY(0); } }
.fade-in-up { animation:fadeInUp 0.8s cubic-bezier(0.16,1,0.3,1) forwards; }

/* ===== RESPONSIVE ===== */
@media (max-width:1024px) {
    .showcase-grid { grid-template-columns:repeat(2, 1fr); }
    .flavors-grid { grid-template-columns:repeat(2, 1fr); }
    .toppings-grid { grid-template-columns:repeat(3, 1fr); }
    .about-teaser-inner { grid-template-columns:1fr; gap:48px; }
    .about-teaser-img img { min-height:320px; }
    .hero-inner { grid-template-columns:1fr; gap:40px; text-align:center; }
    .hero-text { text-align:center; }
    .hero-text .hero-btns { justify-content:center; }
    .hero-image { max-width:500px; margin:0 auto; }
    .hero-product-scene { max-width:80%; margin:0 auto; }
    .press-grid { grid-template-columns:repeat(2, 1fr); }
}

@media (max-width:768px) {
    h2 { font-size:2rem; }
    .section { padding:72px 0; }
    .hero-text h1 { font-size:2.8rem; }
    .hero { min-height:auto; }
    .hero-inner { padding:120px 28px 60px; }
    .showcase-grid { grid-template-columns:1fr 1fr; gap:20px; }
    .toppings-grid { grid-template-columns:repeat(2, 1fr); }
    .visit-grid { grid-template-columns:1fr; gap:36px; }
    .feature-strip-inner { gap:40px; }
    .footer-grid { grid-template-columns:repeat(2, 1fr); gap:36px; }
    .contact-grid { grid-template-columns:1fr; gap:48px; }
    .page-hero { padding:130px 20px 56px; }
    .page-hero h1 { font-size:2.4rem; }

    /* Mobile nav */
    .nav-links { display:none; position:fixed; top:72px; left:0; right:0; bottom:0; background:rgba(255,255,255,0.98); backdrop-filter:blur(20px); flex-direction:column; align-items:center; justify-content:center; gap:36px; }
    .nav-links.active { display:flex; }
    .nav-links a { font-size:1rem; }
    .menu-toggle { display:block; }
    .lang-toggle { margin-left:0; margin-top:8px; padding:8px 20px; font-size:0.85rem; }
}

@media (max-width:480px) {
    .hero-text h1 { font-size:2.2rem; }
    .showcase-grid { grid-template-columns:1fr; }
    .flavors-grid { grid-template-columns:1fr; }
    .toppings-grid { grid-template-columns:1fr 1fr; }
    .footer-grid { grid-template-columns:1fr; }
    .press-grid { grid-template-columns:1fr; }
    .hero-text .hero-btns { flex-direction:column; align-items:center; }
}

/* ===== PINKCARD PAGE ===== */

/* Card Hero — split layout */
.pinkcard-hero { min-height:80vh; display:flex; align-items:center; background:linear-gradient(160deg, #fff 0%, #fdf5f5 40%, #f5faf0 100%); position:relative; overflow:hidden; }
.pinkcard-hero::before { content:''; position:absolute; top:-200px; right:-200px; width:600px; height:600px; background:radial-gradient(circle, rgba(234,127,132,0.08) 0%, transparent 70%); border-radius:50%; }
.pinkcard-hero::after { content:''; position:absolute; bottom:-150px; left:-150px; width:500px; height:500px; background:radial-gradient(circle, rgba(145,200,80,0.06) 0%, transparent 70%); border-radius:50%; }
.pinkcard-hero-inner { display:grid; grid-template-columns:1fr 1fr; gap:60px; align-items:center; max-width:1200px; margin:0 auto; padding:140px 28px 80px; width:100%; position:relative; z-index:1; }
.pinkcard-hero-text h1 { font-size:3.6rem; font-weight:700; color:#333; line-height:1.1; margin-bottom:20px; text-transform:uppercase; }
.pinkcard-hero-text .hero-sub { font-size:1.15rem; color:#666; font-weight:300; margin-bottom:32px; line-height:1.7; }
.pinkcard-hero-text .hero-sub strong { color:#EA7F84; font-weight:600; }

/* 3D Card Container */
.card-scene { perspective:1200px; width:380px; height:240px; margin:0 auto; cursor:pointer; }
.card-wrap { width:100%; height:100%; position:relative; transform-style:preserve-3d; transition:transform 0.8s cubic-bezier(0.4,0,0.2,1); animation:card-float 5s ease-in-out infinite; }
.card-scene:hover .card-wrap { transform:rotateY(180deg); animation-play-state:paused; }
@keyframes card-float {
    0%, 100% { transform:rotateY(-8deg) rotateX(4deg) translateY(0); }
    50% { transform:rotateY(-8deg) rotateX(4deg) translateY(-14px); }
}
.card-face { position:absolute; width:100%; height:100%; backface-visibility:hidden; border-radius:16px; overflow:hidden; box-shadow:0 25px 60px rgba(0,0,0,0.15), 0 8px 20px rgba(0,0,0,0.08); }

/* Card Front */
.card-front { background:linear-gradient(135deg, #EA7F84 0%, #e8959a 50%, #f4b8bb 100%); padding:28px 32px; display:flex; flex-direction:column; justify-content:space-between; position:relative; }
.card-front::before { content:''; position:absolute; top:-30px; right:-30px; width:140px; height:140px; background:rgba(255,255,255,0.12); border-radius:50%; }
.card-front::after { content:''; position:absolute; bottom:-20px; left:40%; width:100px; height:100px; background:rgba(255,255,255,0.08); border-radius:50%; }
.card-front-top { display:flex; justify-content:space-between; align-items:flex-start; position:relative; z-index:1; }
.card-logo { height:32px; filter:brightness(0) invert(1); }
.card-chip { width:40px; height:30px; background:linear-gradient(135deg, #f0d890 0%, #d4b560 100%); border-radius:6px; border:1px solid rgba(255,255,255,0.3); position:relative; }
.card-chip::before { content:''; position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); width:24px; height:18px; border:1px solid rgba(180,150,60,0.4); border-radius:3px; }
.card-front-bottom { position:relative; z-index:1; }
.card-name { color:#fff; font-family:'futura-pt','Jost',sans-serif; font-size:1.8rem; font-weight:700; text-transform:uppercase; letter-spacing:2px; margin-bottom:4px; text-shadow:0 2px 8px rgba(0,0,0,0.1); }
.card-sub { color:rgba(255,255,255,0.85); font-size:0.7rem; font-weight:600; letter-spacing:3px; text-transform:uppercase; }
.card-member { color:rgba(255,255,255,0.7); font-size:0.72rem; letter-spacing:1px; margin-top:12px; font-weight:300; }
.card-dots { display:flex; gap:6px; position:absolute; bottom:28px; right:32px; }
.card-dots span { width:8px; height:8px; background:rgba(255,255,255,0.25); border-radius:50%; }
.card-dots span:last-child { background:rgba(255,255,255,0.5); }

/* Card Back */
.card-back { background:linear-gradient(135deg, #f8f8f8 0%, #fff 100%); transform:rotateY(180deg); display:flex; flex-direction:column; }
.card-back-stripe { height:44px; background:#333; margin-top:20px; }
.card-back-content { padding:16px 32px; flex:1; display:flex; flex-direction:column; justify-content:space-between; }
.card-barcode { height:36px; background:repeating-linear-gradient(90deg, #333 0px, #333 2px, transparent 2px, transparent 4px, #333 4px, #333 5px, transparent 5px, transparent 8px, #333 8px, #333 10px, transparent 10px, transparent 11px, #333 11px, #333 14px, transparent 14px, transparent 16px); border-radius:4px; margin:8px 0; }
.card-barcode-num { text-align:center; font-size:0.7rem; color:#999; letter-spacing:3px; font-family:'futura-pt','Jost',sans-serif; }
.card-back-info { font-size:0.6rem; color:#999; line-height:1.5; text-align:center; }
.card-back-info strong { color:#EA7F84; }
.card-back-logo { text-align:center; margin-top:8px; }
.card-back-logo img { height:20px; display:inline-block; opacity:0.4; }

/* Card glow effect */
.card-glow { position:absolute; width:420px; height:280px; top:50%; left:50%; transform:translate(-50%,-50%); background:radial-gradient(ellipse, rgba(234,127,132,0.15) 0%, transparent 60%); border-radius:50%; z-index:-1; pointer-events:none; animation:glow-pulse 4s ease-in-out infinite alternate; }

/* Flip hint */
.card-hint { text-align:center; margin-top:16px; font-size:0.75rem; color:#bbb; letter-spacing:1px; text-transform:uppercase; font-weight:400; }

/* Steps section — numbered circles */
.pinkcard-steps { display:grid; grid-template-columns:repeat(3,1fr); gap:32px; margin-top:56px; position:relative; }
.pinkcard-steps::before { content:''; position:absolute; top:40px; left:calc(16.66% + 16px); right:calc(16.66% + 16px); height:2px; background:linear-gradient(90deg, #EA7F84, #91C850); opacity:0.2; }
.step-card { text-align:center; position:relative; }
.step-num { width:80px; height:80px; border-radius:50%; background:#fff; border:2px solid #f0f0f0; display:flex; align-items:center; justify-content:center; font-family:'futura-pt','Jost',sans-serif; font-size:1.8rem; font-weight:700; color:#EA7F84; margin:0 auto 20px; transition:all 0.4s; box-shadow:0 4px 20px rgba(0,0,0,0.04); }
.step-card:hover .step-num { background:#EA7F84; color:#fff; border-color:#EA7F84; transform:scale(1.1); box-shadow:0 8px 30px rgba(234,127,132,0.25); }
.step-card h3 { font-size:0.95rem; color:#333; margin-bottom:8px; }
.step-card p { color:#666; font-size:0.92rem; line-height:1.7; font-weight:300; max-width:260px; margin:0 auto; }

/* Reward cards — gradient borders */
.reward-cards { display:grid; grid-template-columns:repeat(3,1fr); gap:28px; margin-top:56px; }
.reward-card { background:#fff; border-radius:20px; padding:36px 28px; text-align:center; position:relative; overflow:hidden; border:1px solid #f0f0f0; transition:all 0.4s cubic-bezier(0.4,0,0.2,1); }
.reward-card::before { content:''; position:absolute; top:0; left:0; right:0; height:4px; background:linear-gradient(90deg, #EA7F84, #91C850); opacity:0; transition:opacity 0.4s; }
.reward-card:hover { transform:translateY(-8px); box-shadow:0 20px 60px rgba(0,0,0,0.08); }
.reward-card:hover::before { opacity:1; }
.reward-icon { width:64px; height:64px; border-radius:50%; display:flex; align-items:center; justify-content:center; font-size:1.6rem; margin:0 auto 20px; }
.reward-icon.signup { background:linear-gradient(135deg, #fde8e9, #f8d0d2); }
.reward-icon.tenth { background:linear-gradient(135deg, #e8f5d6, #d4edb8); }
.reward-icon.bday { background:linear-gradient(135deg, #fff3e0, #ffe0b2); }
.reward-card h3 { font-size:0.95rem; color:#333; margin-bottom:8px; }
.reward-card p { color:#666; font-size:0.9rem; line-height:1.7; font-weight:300; }

/* PinkCard Homepage Promo */
.pinkcard-promo { padding:100px 0; background:linear-gradient(160deg, #fdf5f5 0%, #fff 40%, #f5faf0 100%); position:relative; overflow:hidden; }
.pinkcard-promo::before { content:''; position:absolute; top:-100px; left:-100px; width:400px; height:400px; background:radial-gradient(circle, rgba(234,127,132,0.06) 0%, transparent 70%); border-radius:50%; }
.pinkcard-promo-inner { display:grid; grid-template-columns:1fr 1fr; gap:60px; align-items:center; max-width:1200px; margin:0 auto; padding:0 28px; }
.pinkcard-promo-text h2 { font-size:2.2rem; margin-bottom:16px; }
.pinkcard-promo-text p { color:#666; font-size:1.05rem; line-height:1.8; font-weight:300; margin-bottom:24px; }
.pinkcard-promo-badge { display:inline-block; background:#EA7F84; color:#fff; font-size:0.65rem; font-weight:700; letter-spacing:2px; text-transform:uppercase; padding:5px 14px; border-radius:50px; margin-bottom:16px; }
.pinkcard-promo-perks { display:grid; gap:12px; margin-bottom:32px; }
.pinkcard-perk { display:flex; align-items:center; gap:10px; font-size:0.92rem; color:#555; font-weight:400; }
.pinkcard-perk span:first-child { font-size:1.1rem; }
.pinkcard-promo-card { display:flex; justify-content:center; align-items:center; }
@media (max-width:768px) {
    .pinkcard-promo-inner { grid-template-columns:1fr; text-align:center; }
    .pinkcard-promo-perks { justify-items:center; }
    .pinkcard-promo-card { margin-top:20px; }
}

/* PinkCard page responsive */
@media (max-width:1024px) {
    .pinkcard-hero-inner { grid-template-columns:1fr; text-align:center; gap:40px; }
    .pinkcard-hero-text h1 { font-size:2.8rem; }
    .card-scene { width:340px; height:214px; }
}
@media (max-width:768px) {
    .pinkcard-hero { min-height:auto; }
    .pinkcard-hero-inner { padding:120px 28px 60px; }
    .pinkcard-hero-text h1 { font-size:2.2rem; }
    .pinkcard-steps { grid-template-columns:1fr; gap:24px; }
    .pinkcard-steps::before { display:none; }
    .reward-cards { grid-template-columns:1fr; }
    .card-scene { width:300px; height:189px; }
    .card-name { font-size:1.4rem; }
}
@media (max-width:480px) {
    .card-scene { width:260px; height:164px; }
    .card-front { padding:20px 24px; }
    .card-name { font-size:1.2rem; }
    .card-logo { height:24px; }
}