@import url('https://fonts.googleapis.com/css2?family=Nunito+Sans:wght@400;500;600;700;800;900&display=swap');
:root{--blue:#0878e8;--cyan:#12b8df;--navy:#092e69;--pale:#effaff;--line:#cfeaff;--muted:#52739e;--green:#08b765}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--pale);color:var(--navy);font-family:'Nunito Sans',Arial,sans-serif;font-size:15px;line-height:1.65}a{color:inherit;text-decoration:none}.site-header{min-height:78px;background:#fff;border-bottom:1px solid var(--line);display:flex;align-items:center;gap:22px;padding:10px clamp(20px,5vw,80px);position:sticky;top:0;z-index:20}.brand{display:flex;align-items:center;gap:10px;flex-shrink:0;color:var(--blue);font-size:28px;font-weight:900;letter-spacing:-1px}.brand img{width:48px;height:48px;border-radius:50%;object-fit:contain}.main-nav{display:flex;align-items:center;justify-content:center;gap:4px;flex:1;flex-wrap:wrap}.main-nav a{font-size:13px;font-weight:800;padding:10px 11px;border-radius:14px;white-space:nowrap}.main-nav a:hover,.main-nav a.active{background:#dff4ff;color:#0067dc}.header-actions{display:flex;gap:8px;flex-shrink:0}.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;border-radius:13px;padding:13px 18px;font-weight:900;line-height:1.2;border:1px solid transparent;transition:transform .15s,box-shadow .15s}.btn:hover{transform:translateY(-2px);box-shadow:0 8px 20px #005bb31c}.btn-blue{background:linear-gradient(110deg,#0878e8,#0759dc);color:#fff}.btn-green{background:var(--green);color:#fff}.btn-light{background:#fff;color:var(--blue);border-color:#b9e2ff}.menu-toggle{display:none;background:#e3f6ff;border:0;border-radius:10px;padding:10px 12px;color:var(--blue);font-size:20px}.home-hero{display:grid;grid-template-columns:.92fr 1.08fr;gap:30px;align-items:center;padding:32px clamp(20px,4.5vw,70px) 18px;background:linear-gradient(110deg,#eefaff,#e0f7ff)}.hero-copy{max-width:650px}.eyebrow{color:#0075ed;font-weight:900;font-size:12px;letter-spacing:1.8px;margin:0 0 10px}.hero-copy h1{font-size:clamp(38px,4vw,58px);line-height:1.02;letter-spacing:-2px;margin:0 0 14px;color:var(--navy);font-weight:900}.hero-copy h1 span{color:var(--blue)}.lead{font-size:15px;line-height:1.8;max-width:590px;margin:0 0 20px}.hero-actions{display:flex;gap:10px;flex-wrap:wrap}.tiny-note{font-size:10px;color:var(--muted);margin:10px 0 0}.hero-visual{position:relative;min-height:410px}.hero-image{position:absolute;inset:0;border-radius:28px;overflow:hidden;background:linear-gradient(135deg,#0878e8,#8ce7fa);box-shadow:0 18px 35px #0969b51a}.hero-image img{width:100%;height:100%;position:absolute;inset:0;object-fit:cover;object-position:center}.hours-sticker{position:absolute;top:28px;left:5%;width:124px;height:124px;border-radius:50%;background:#092b68;border:7px solid #fff;outline:4px solid #05c5ff;box-shadow:0 8px 22px #00275d55;color:#fff;display:flex;flex-direction:column;align-items:center;justify-content:center;transform:rotate(-8deg);line-height:1.05}.hours-sticker strong{font-size:34px;color:#ffec35}.hours-sticker small{font-size:11px;font-weight:900}.vending-card{position:absolute;right:3%;top:15px;width:142px;padding:10px;background:linear-gradient(160deg,#005bd9,#09a7e8);border:4px solid white;outline:2px solid #6ee7ff;border-radius:18px;box-shadow:0 10px 22px #003d7e55;text-align:center;color:white;transform:rotate(2deg)}.vending-title{font-size:11px;font-weight:900;line-height:1.2}.vending-title small{display:block;color:#ffed3b;font-size:9px}.vending-shelves{margin:8px 0;background:#eafaff;border:2px solid #78e6ff;border-radius:9px;display:grid;grid-template-columns:repeat(4,1fr);gap:5px;padding:8px 3px;font-size:20px}.vending-foot{font-size:8px;font-weight:900;color:#fff35a}.wifi-sticker{position:absolute;right:2%;bottom:16px;background:linear-gradient(100deg,#034aa9,#0784e9);color:#fff;border:3px solid #b8f3ff;border-radius:18px;padding:12px 14px;display:flex;align-items:center;gap:10px;max-width:245px;box-shadow:0 8px 22px #003c7b55}.wifi-sticker>span{font-size:29px}.wifi-sticker strong,.wifi-sticker small{display:block;line-height:1.25}.wifi-sticker strong{font-size:12px}.wifi-sticker small{font-size:10px;margin-top:4px}.brand-sticker{position:absolute;left:16px;bottom:15px;background:#fff;padding:8px 14px;border-radius:16px;box-shadow:0 8px 20px #003b722b;display:flex;gap:9px;align-items:center;font-size:22px}.brand-sticker b,.brand-sticker small{display:block;line-height:1.2}.brand-sticker b{font-size:13px}.brand-sticker small{font-size:9px;color:var(--muted)}.quick-benefits{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;padding:0 clamp(20px,4.5vw,70px);background:#e5f8ff}.benefit{display:flex;align-items:center;gap:13px;background:#fff;border:1px solid var(--line);border-radius:17px;padding:13px 16px;min-height:70px}.benefit>span{width:40px;height:40px;display:grid;place-items:center;border-radius:13px;background:#e0f6ff;color:var(--blue);font-size:22px}.benefit b,.benefit small{display:block;line-height:1.35}.benefit b{font-size:13px}.benefit small{font-size:11px;color:var(--muted);margin-top:3px}.home-feature{display:grid;grid-template-columns:1.1fr .9fr;gap:26px;align-items:center;padding:42px clamp(20px,4.5vw,70px)}.feature-photo{height:290px;border-radius:23px;overflow:hidden;border:5px solid #fff;box-shadow:0 14px 32px #075aa51b;background:#bdeeff}.feature-photo img{width:100%;height:100%;object-fit:cover}.feature-copy h2,.section-heading h2{font-size:clamp(27px,3vw,40px);line-height:1.15;margin:0 0 13px;letter-spacing:-.7px}.feature-copy p:not(.eyebrow){color:var(--muted)}.home-links{padding:15px clamp(20px,4.5vw,70px) 55px}.section-heading{margin-bottom:20px}.link-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}.link-card,.panel{background:#fff;border:1px solid var(--line);border-radius:22px;box-shadow:0 8px 25px #0878e80a}.link-card{padding:22px;transition:transform .18s,box-shadow .18s}.link-card:hover{transform:translateY(-4px);box-shadow:0 14px 30px #0878e81a}.link-card>span{font-size:29px}.link-card h3{margin:8px 0 4px}.link-card p{color:var(--muted);font-size:13px}.link-card b{color:var(--blue);font-size:13px}.site-footer{background:#062b65;color:white;padding:30px clamp(20px,5vw,80px);display:flex;align-items:center;justify-content:space-between;gap:20px;flex-wrap:wrap}.footer-brand b,.footer-brand span{display:block}.footer-brand b{font-size:23px}.footer-brand span,.site-footer p{font-size:12px;color:#b7d9ff}.footer-links{display:flex;gap:18px;flex-wrap:wrap;font-size:13px}.inner-main{max-width:1420px;margin:auto;padding:28px clamp(20px,5vw,70px) 60px}.page-hero{padding:34px;border-radius:28px;background:linear-gradient(110deg,#0878e8,#12b8df);color:white;margin-bottom:30px}.page-hero .eyebrow{color:#e2f9ff}.page-hero h1{font-size:clamp(30px,3.5vw,46px);line-height:1.15;margin:0 0 10px;letter-spacing:-1px}.page-hero>p:last-child{max-width:760px;margin:0;line-height:1.8}.two-cards{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}.panel{padding:25px;min-width:0}.panel h2{font-size:23px;line-height:1.25;margin:12px 0}.panel p,.panel li{color:var(--muted)}.panel ul{padding-left:21px}.panel li{margin:8px 0}.pill{display:inline-block;background:#e2f6ff;color:#0073e6;border-radius:99px;padding:6px 12px;font-size:10px;font-weight:900}.steps{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.steps article{border:1px solid var(--line);border-radius:20px;padding:18px}.step-num{display:grid;place-items:center;width:37px;height:37px;border-radius:50%;background:var(--blue);color:white;font-weight:900}.steps h3{font-size:15px;margin:10px 0 5px}.steps p{font-size:13px;margin:0;line-height:1.7}.info-note{background:#e7f8ff;border-radius:15px;padding:13px 15px;color:#4c7099!important;font-size:12px}.price-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}.price-card{min-height:300px}.price{display:block;color:var(--blue);font-size:32px;font-weight:900;margin:4px 0}.small{font-size:12px;color:var(--muted)}.mini-feature{display:flex;align-items:center;gap:12px;border:1px solid var(--line);border-radius:18px;padding:13px;margin-top:10px}.mini-feature>span{width:42px;height:42px;display:grid;place-items:center;background:#e1f6ff;border-radius:13px;font-size:22px}.mini-feature b{font-size:13px}.mini-feature p{font-size:11px;margin:2px 0 0}.payment-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:9px;margin:18px 0}.payment-grid div{min-height:77px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;border:1px solid var(--line);border-radius:15px;background:#fff;color:var(--blue);font-size:21px}.payment-grid b{font-size:12px;color:var(--navy)}.emoji-big{font-size:28px}.vending-demo{max-width:250px;margin:20px auto 0;background:linear-gradient(150deg,#0562dc,#11b6e5);border:5px solid #e1fbff;outline:1px solid #9eeaff;border-radius:20px;padding:13px;color:#fff;text-align:center;box-shadow:0 12px 24px #0878e81b}.vending-demo .vending-title{font-size:13px}.vending-demo .vending-title small{font-size:10px}.vending-demo .vending-shelves{grid-template-columns:repeat(3,1fr);font-size:23px;padding:10px}.facility-card{min-height:285px}.map-frame{height:360px;border-radius:18px;overflow:hidden;background:#e0f3ff}.map-frame iframe{width:100%;height:100%;border:0}.member-banner{background:linear-gradient(110deg,#0a367a,#0878e8);color:#fff;border-radius:27px;padding:30px;margin-bottom:28px}.member-banner h2{font-size:30px;margin:10px 0}.member-banner p{line-height:1.8}.member-banner .pill{background:#e7f6ff}.timeline{border-left:3px solid #c7eaff;margin:20px 0 0 6px;padding-left:20px}.timeline>div{position:relative;margin:18px 0}.timeline>div:before{content:"";position:absolute;width:11px;height:11px;background:var(--blue);border:3px solid #d9f5ff;border-radius:50%;left:-28px;top:6px}.timeline p{margin:4px 0;font-size:13px}
@media(max-width:1150px){.site-header{gap:12px;padding:10px 20px}.main-nav a{padding:9px 7px;font-size:12px}.header-actions .btn{padding:11px 12px;font-size:12px}.brand{font-size:24px}.home-hero{gap:20px}.hero-visual{min-height:360px}.link-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:820px){.site-header{flex-wrap:wrap;position:sticky}.menu-toggle{display:block;margin-left:auto}.header-actions{margin-left:auto}.main-nav{display:none;order:4;flex-basis:100%;justify-content:flex-start;align-items:stretch}.main-nav.open{display:flex}.main-nav a{font-size:13px}.home-hero{grid-template-columns:1fr;padding-top:25px}.hero-copy{max-width:none}.hero-visual{min-height:380px}.quick-benefits{grid-template-columns:1fr;padding-top:10px}.home-feature{grid-template-columns:1fr}.two-cards{grid-template-columns:1fr}.price-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.page-hero{padding:26px}.inner-main{padding-top:22px}}
@media(max-width:520px){.brand img{width:39px;height:39px}.brand{font-size:22px}.header-actions .btn{padding:10px;font-size:11px}.header-actions .btn:first-child{display:none}.main-nav.open{display:grid;grid-template-columns:repeat(2,1fr)}.hero-copy h1{font-size:42px}.hero-visual{min-height:310px}.hours-sticker{width:95px;height:95px;top:15px}.hours-sticker strong{font-size:27px}.vending-card{width:118px;right:2%;top:10px}.vending-shelves{font-size:17px}.wifi-sticker{max-width:205px;padding:8px;bottom:10px}.wifi-sticker strong{font-size:10px}.brand-sticker{bottom:10px;left:8px}.hero-actions .btn{width:100%}.feature-photo{height:220px}.link-grid,.price-grid{grid-template-columns:1fr}.steps{grid-template-columns:1fr}.panel{padding:19px}.page-hero h1{font-size:31px}.page-hero{padding:23px}.payment-grid{grid-template-columns:repeat(3,1fr)}.map-frame{height:280px}.site-footer{display:block}.footer-links{margin:18px 0}.site-footer p{margin-bottom:0}}

/* Penyesuaian khusus halaman Tentang Nyuciin */
.about-page .about-hero{position:relative;overflow:hidden;padding:30px 34px;background:linear-gradient(110deg,rgba(0,104,225,.94),rgba(0,177,216,.91)),url('assets/foto-toko-banner.jpeg') center/cover}
.about-page .about-hero-brand{display:flex;align-items:center;gap:12px;margin:0 0 10px;color:#fff;font-weight:900;font-size:11px;letter-spacing:1px}
.about-page .about-hero-brand img{width:62px;height:62px;object-fit:contain;background:#fff;border:3px solid #fff;border-radius:50%;box-shadow:0 5px 15px #003a8055}
.about-page .about-hero .eyebrow{margin-top:4px}
.about-page .about-hero>p:last-of-type{max-width:900px}
.about-page .about-motto{display:flex;gap:8px;flex-wrap:wrap;margin-top:18px}
.about-page .about-motto span{background:#fff;color:#075cc8;border:1px solid #c6f4ff;border-radius:99px;padding:7px 13px;font-size:11px;font-weight:900;box-shadow:0 4px 12px #003b7d22}
.about-page .story-panel{background:linear-gradient(180deg,rgba(255,255,255,.94),rgba(255,255,255,.88)),url('assets/foto-lokasi-asli.jpeg') center/cover;border-color:#b9e4ff}
.about-page .story-panel p{color:#365a84}
.about-page .about-values{display:flex;gap:8px;flex-wrap:wrap}
.about-page .about-values b{display:inline-block;background:#e2f6ff;color:#006bdc;border-radius:99px;padding:5px 10px;font-size:12px}
@media(max-width:700px){.about-page .about-hero{padding:24px}.about-page .about-hero-brand img{width:52px;height:52px}}

/* Social media contact panels */
.nyuciin-social-panel { margin-top: 24px; }
.nyuciin-social-panel > p { color: #58769c; line-height: 1.7; }
.nyuciin-social-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; margin-top:18px; }
.nyuciin-social-grid a { display:flex; align-items:center; gap:12px; min-width:0; padding:14px; border:1px solid #cfe7ff; border-radius:16px; background:#fff; color:#0a2e64; text-decoration:none; transition:transform .18s ease, box-shadow .18s ease; }
.nyuciin-social-grid a:hover { transform:translateY(-2px); box-shadow:0 8px 22px rgba(0,93,180,.10); }
.nyuciin-social-grid a span:nth-child(2) { display:flex; flex-direction:column; gap:4px; }
.nyuciin-social-grid small { font-size:12px; color:#6682a6; }
.ns-icon { display:grid; place-items:center; flex:0 0 42px; height:42px; border-radius:13px; color:#fff; font-size:25px; font-weight:800; }
.ns-icon.instagram { background:linear-gradient(135deg,#7454d8,#e44883,#ffad52); }
.ns-icon.facebook { background:#1877f2; }
.ns-icon.threads { background:#171717; }
.ns-icon.whatsapp { background:#08b86b; }
.ns-arrow { margin-left:auto; color:#6e91b8; font-size:18px; }
@media(max-width:600px) { .nyuciin-social-grid { grid-template-columns:1fr; } }
