/*
Theme Name: Salon POS Landing
Theme URI: https://example.com/
Author: ChatGPT
Author URI: https://openai.com/
Description: One-page landing page untuk software POS salon. Dibuat dari desain referensi dengan layout hero, fitur, manfaat, testimoni, pricing, CTA, dan footer.
Version: 1.0.0
Requires at least: 5.8
Tested up to: 6.6
Requires PHP: 7.4
License: GPLv2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: salon-pos-landing
*/
:root{--blue:#2f86ff;--blue2:#0f69e8;--pink:#ff4fa3;--navy:#0c1738;--text:#59647e;--muted:#eef5ff;--line:#e8effa;--shadow:0 22px 70px rgba(41,86,148,.13);--radius:22px}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Arial,sans-serif;color:var(--navy);background:linear-gradient(180deg,#f8fbff 0,#fff 48%,#f8fbff 100%);line-height:1.65}a{text-decoration:none;color:inherit}.section-wrap{width:min(1180px,calc(100% - 48px));margin-inline:auto}.site-header{height:78px;width:min(1180px,calc(100% - 48px));margin:auto;display:flex;align-items:center;gap:28px;justify-content:space-between}.brand img{display:block;width:156px}.nav{display:flex;gap:42px;font-weight:700;font-size:14px}.nav a{color:#1a2545}.nav a:hover{color:var(--blue)}.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;border-radius:14px;padding:15px 25px;font-weight:800;font-size:14px;border:1px solid transparent;transition:.2s}.btn:hover{transform:translateY(-2px);box-shadow:0 14px 28px rgba(47,134,255,.18)}.btn-primary{background:var(--blue);color:white}.btn-pink{background:var(--pink);color:white}.btn-light{background:white;color:#112049;border-color:var(--line);box-shadow:0 12px 30px rgba(10,44,91,.08)}.btn-white{background:#fff;color:var(--blue)}.menu-toggle{display:none;border:0;background:white;font-size:24px;border-radius:12px;padding:8px 12px;box-shadow:var(--shadow)}.hero{display:grid;grid-template-columns:1fr 1.15fr;align-items:center;gap:28px;padding:44px 0 42px}.eyebrow{display:inline-block;background:#fff0f8;color:var(--pink);border-radius:999px;padding:7px 14px;font-weight:900;font-size:13px;letter-spacing:.08em}.hero h1{font-size:54px;line-height:1.12;margin:20px 0 18px;letter-spacing:-.045em}.hero h1 span{color:var(--blue);position:relative}.hero h1 span:after{content:"";position:absolute;left:0;right:0;bottom:-8px;height:7px;background:linear-gradient(90deg,#ffc2dc,#ff5ca8);border-radius:999px;opacity:.75}.hero p{font-size:18px;color:var(--text);max-width:640px}.hero-points{display:grid;grid-template-columns:repeat(2,max-content);gap:12px 36px;margin:26px 0;color:#44506c;font-size:14px;font-weight:700}.actions{display:flex;gap:16px;align-items:center;flex-wrap:wrap}.micro{font-size:13px!important;margin-top:16px}.hero-visual img{width:100%;display:block}.trusted{background:white;border:1px solid var(--line);box-shadow:var(--shadow);border-radius:22px;text-align:center;padding:22px 32px;margin-top:8px}.trusted p{margin:0 0 18px;color:#66708b}.trusted strong{color:var(--blue)}.logos{display:grid;grid-template-columns:repeat(7,1fr);gap:18px;align-items:center}.logos span{font-family:Georgia,serif;font-size:21px;line-height:1.05;color:#1a2034;opacity:.82;font-weight:700}.features,.testimonials,.pricing{padding:50px 0}.features h2,.testimonials h2,.pricing h2{text-align:center;font-size:30px;line-height:1.2;margin:0 0 36px}.features h2 span{border-bottom:4px solid var(--pink)}.feature-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:16px}.feature-grid article,.quote-grid article,.price-card{background:white;border:1px solid var(--line);border-radius:18px;padding:24px 18px;box-shadow:0 16px 40px rgba(40,80,140,.08)}.feature-grid article{text-align:center}.ico{width:54px;height:54px;margin:0 auto 14px;border-radius:16px;display:grid;place-items:center;background:#eff7ff;font-size:29px}.feature-grid h3{font-size:16px;line-height:1.25;margin:0 0 8px}.feature-grid p{font-size:13px;margin:0;color:var(--text)}.benefits{display:grid;grid-template-columns:1fr 370px 280px;gap:36px;align-items:center;padding:30px 0 42px}.small-title{font-size:12px;font-weight:900;letter-spacing:.08em;color:var(--blue)}.benefit-copy h2{font-size:34px;line-height:1.18;margin:10px 0 24px}.benefit-copy ul,.price-card ul{padding:0;margin:0;list-style:none}.benefit-copy li{margin:13px 0;color:#35415d;font-weight:650}.benefit-copy li:before,.price-card li:before{content:"✓";color:var(--blue);font-weight:900;margin-right:12px}.stylist{width:100%;display:block}.roi-card{background:white;border:1px solid var(--line);box-shadow:var(--shadow);border-radius:20px;padding:34px}.roi-card span{color:var(--blue);font-weight:800}.roi-card strong{display:block;color:var(--pink);font-size:70px;line-height:1;margin:12px 0}.roi-card p{color:var(--text);margin:0}.quote-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}.quote-grid p{color:#3e4862;margin-top:0}.stars{color:#ffc400;letter-spacing:4px;margin:14px 0}.quote-grid strong{display:block}.quote-grid span{display:block;color:var(--text);font-size:14px}.price-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:20px}.price-card{position:relative;padding:28px 24px}.price-card h3{text-align:center;margin:0 0 8px}.price-card .price{text-align:center;color:var(--blue);font-size:32px;font-weight:900;line-height:1.1}.price small{font-size:14px;margin-right:8px;color:#74809b}.price em{font-size:13px;color:#6d7790;font-style:normal;font-weight:700}.price-card p{text-align:center;color:#59647e;font-size:14px}.price-card li{font-size:14px;margin:11px 0;color:#384460}.price-card .btn{width:100%;margin-top:22px}.popular{border-color:#ffc0db;background:linear-gradient(180deg,#fff7fb,#fff)}.tag{position:absolute;top:-11px;left:50%;transform:translateX(-50%);background:var(--pink);color:white;border-radius:999px;padding:4px 13px;font-size:10px;font-weight:900}.addon{background:linear-gradient(180deg,#fff,#fff5fa)}.addon li{background:#fff7fb;border-radius:12px;padding:12px}.trust-row{display:flex;justify-content:center;gap:44px;flex-wrap:wrap;margin-top:28px;color:#52617e;font-size:14px;font-weight:750}.cta{margin-top:12px;margin-bottom:38px;border-radius:22px;background:linear-gradient(90deg,#51a0ff,#2f86ff);color:white;display:grid;grid-template-columns:190px 1fr auto;align-items:center;gap:26px;min-height:128px;padding:0 48px 0 12px;overflow:hidden}.cta img{align-self:end;width:190px}.cta h2{font-size:31px;margin:0}.cta p{margin:4px 0 0;opacity:.9}.footer{border-top:1px solid var(--line);padding:34px 0 24px;display:grid;grid-template-columns:1.4fr repeat(4,1fr);gap:28px}.footer img{width:150px}.footer h4{font-size:13px;margin:0 0 12px}.footer a,.footer p{display:block;color:#59647e;margin:6px 0;font-size:14px}.social{color:var(--blue)!important;font-size:22px!important;letter-spacing:8px}.copyright{grid-column:1/-1;text-align:center;border-top:1px solid var(--line);padding-top:18px!important}@media(max-width:1050px){.nav{gap:18px}.hero{grid-template-columns:1fr}.hero h1{font-size:44px}.feature-grid{grid-template-columns:repeat(3,1fr)}.benefits{grid-template-columns:1fr}.stylist{max-width:360px;margin:auto}.price-grid{grid-template-columns:repeat(2,1fr)}.cta{grid-template-columns:1fr;text-align:center;padding:28px}.cta img{display:none}.footer{grid-template-columns:repeat(2,1fr)}}@media(max-width:720px){.section-wrap,.site-header{width:min(100% - 28px,1180px)}.site-header{height:auto;padding:18px 0;flex-wrap:wrap}.menu-toggle{display:block}.nav{display:none;width:100%;flex-direction:column;gap:10px;background:white;padding:16px;border-radius:18px;box-shadow:var(--shadow)}.nav.open{display:flex}.site-header>.btn{display:none}.hero{padding-top:22px}.hero h1{font-size:36px}.hero p{font-size:16px}.hero-points{grid-template-columns:1fr}.trusted{padding:20px}.logos{grid-template-columns:repeat(2,1fr)}.feature-grid,.quote-grid,.price-grid{grid-template-columns:1fr}.features,.testimonials,.pricing{padding:36px 0}.benefit-copy h2{font-size:30px}.roi-card strong{font-size:54px}.trust-row{gap:14px;flex-direction:column;align-items:center}.footer{grid-template-columns:1fr}.cta h2{font-size:26px}}
