/* Sisa Proyek Modern — presentation layer for Classiera 4.0.5.1. */
:root{--sp-navy:#102b40;--sp-ink:#193144;--sp-muted:#6c7c8b;--sp-orange:#ed7949;--sp-line:#e4e9eb;--sp-bg:#f5f7f7}
html{scroll-behavior:smooth}body{font-family:Arial,Helvetica,sans-serif;color:var(--sp-ink);background:#fff}body.admin-bar .sp-header{top:32px}a:hover{text-decoration:none}.container{max-width:1180px}.sp-topline{background:#112c40;color:#c6d7de;font-size:12px}.sp-topline .container{display:flex;justify-content:space-between;padding-top:9px;padding-bottom:9px}.sp-header{background:#fff;position:sticky;top:0;z-index:999;box-shadow:0 3px 22px rgba(10,38,48,.08)}.sp-nav{min-height:78px;display:flex;align-items:center;gap:30px}.sp-brand{display:flex;align-items:center;gap:9px;white-space:nowrap;color:#17364a;font-weight:800;font-size:20px;letter-spacing:-.8px}.sp-brand:hover{color:#17364a}.sp-brand img{max-width:205px;max-height:54px;width:auto;height:auto;object-fit:contain}.sp-brandmark{display:grid;place-items:center;width:36px;height:36px;background:var(--sp-orange);border-radius:10px;color:#fff;font-size:23px;transform:rotate(-7deg)}.sp-brand em{font-style:normal;color:var(--sp-orange)}.sp-menu{margin-left:auto}.sp-menu-list{display:flex;align-items:center;gap:25px;margin:0;padding:0;list-style:none}.sp-menu-list li{position:relative;list-style:none}.sp-menu-list>li>a{display:block;padding:28px 0;color:#223a4d;font-size:14px;font-weight:700}.sp-menu-list a:hover,.sp-menu-list .current-menu-item>a{color:var(--sp-orange)}.sp-menu-list .sub-menu{display:none;position:absolute;top:100%;left:0;min-width:220px;margin:0;padding:8px;background:#fff;box-shadow:0 16px 35px #15384b29;border-radius:10px;list-style:none}.sp-menu-list li:hover>.sub-menu,.sp-menu-list li:focus-within>.sub-menu{display:block}.sp-menu-list .sub-menu li a{display:block;padding:10px 12px;font-size:13px;color:#273e4e}.sp-menu-list .sub-menu li a:hover{background:#f7f8f8;color:var(--sp-orange)}.sp-menu-list .sub-menu .sub-menu{left:100%;top:0}.sp-nav-actions{display:flex;align-items:center;gap:18px;white-space:nowrap}.sp-account{font-size:13px;font-weight:700;color:#253e51}.sp-post,.sp-post:hover{display:inline-block;background:var(--sp-orange);color:#fff;border-radius:9px;padding:12px 16px;font-size:13px;font-weight:800;box-shadow:0 7px 15px #ed79492d}.sp-post:hover{background:#dd6434}.sp-toggle{display:none;border:0;background:transparent;color:#153346;font-size:26px;line-height:1}
.sp-hero{height:510px;position:relative;background:linear-gradient(90deg,rgba(12,38,58,.47),rgba(12,38,58,.05)),url('hero-construction.webp') center/cover no-repeat}.sp-hero:after{content:"";position:absolute;bottom:0;left:0;right:0;height:85px;background:linear-gradient(0deg,#08243942,transparent)}.sp-hero-content{height:100%;display:flex;align-items:center;position:relative;z-index:1}.sp-hero-copy{max-width:680px;color:#fff;padding-bottom:35px}.sp-eyebrow{font-size:12px;letter-spacing:2px;font-weight:800;text-transform:uppercase;color:#fed3af}.sp-eyebrow:before{content:"";display:inline-block;vertical-align:middle;width:26px;height:2px;background:#f4a56f;margin-right:9px}.sp-hero h1{font-size:clamp(36px,4.2vw,57px);font-weight:800;letter-spacing:-2px;line-height:1.13;margin:21px 0 14px;color:#fff}.sp-hero h1 span{color:#ffb078}.sp-hero p{font-size:17px;line-height:1.65;color:#e4ebee;max-width:540px;margin:0}.sp-search{display:flex;align-items:stretch;position:absolute;left:15px;right:15px;bottom:-37px;padding:9px;background:#fff;border-radius:14px;box-shadow:0 19px 35px #0b25383d;z-index:2;min-height:74px}.sp-field{display:flex;align-items:center;gap:12px;padding:0 18px;margin:0;border-right:1px solid var(--sp-line);min-width:0;font-weight:400}.sp-field:first-child{flex:1.3}.sp-field:nth-child(2),.sp-field:nth-child(3){flex:1}.sp-field>i{color:#d07b57;font-size:17px;min-width:18px}.sp-field>span{display:block;min-width:0;width:100%}.sp-field small{font-size:10px;letter-spacing:1px;text-transform:uppercase;color:#8b99a3;font-weight:800;display:block;margin-bottom:4px}.sp-field input,.sp-field select{background:transparent!important;border:0!important;outline:0!important;box-shadow:none!important;width:100%;height:22px!important;padding:0!important;color:#294357;font-size:14px;font-weight:600;appearance:auto}.sp-search button{background:var(--sp-orange);border:0;color:#fff;border-radius:9px;padding:0 20px;min-width:140px;font-weight:800}.sp-search button:hover{background:#dd6434}
.sp-section{padding:76px 0}.sp-categories{padding-top:100px}.sp-heading{display:flex;align-items:end;justify-content:space-between;gap:20px;margin-bottom:27px}.sp-kicker{color:var(--sp-orange);font-size:11px;text-transform:uppercase;letter-spacing:2px;font-weight:800}.sp-heading h2{font-size:31px;letter-spacing:-1px;font-weight:800;margin:6px 0 7px;color:var(--sp-ink)}.sp-heading p{font-size:14px;color:var(--sp-muted);margin:0}.sp-more{font-size:13px;font-weight:800;color:#c8653d;white-space:nowrap}.sp-more:hover{color:#a85435}.sp-category-grid{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:15px}.sp-category{display:block;border:1px solid var(--sp-line);border-radius:14px;background:#fff;min-height:139px;padding:20px 15px;transition:transform .2s,box-shadow .2s,border-color .2s}.sp-category:hover{border-color:var(--sp-orange);box-shadow:0 9px 24px #152f4212;transform:translateY(-3px)}.sp-category-icon{width:43px;height:43px;border-radius:11px;background:#f8ede7;color:#b96843;display:grid;place-items:center;font-size:20px;margin-bottom:16px}.sp-category strong{display:block;color:var(--sp-ink);font-size:13px}.sp-category small{display:block;color:#91a0aa;margin-top:5px;font-size:11px}.sp-listings{background:var(--sp-bg);padding-top:64px}.sp-tabs{display:flex;gap:8px}.sp-tabs button{border:1px solid var(--sp-line);background:#fff;color:#697d8a;border-radius:7px;padding:9px 14px;font-size:12px;font-weight:800}.sp-tabs button.active{background:var(--sp-navy);color:#fff;border-color:var(--sp-navy)}.sp-product-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:20px}.sp-product{background:#fff;border:1px solid var(--sp-line);border-radius:13px;overflow:hidden;transition:transform .2s,box-shadow .2s;min-width:0}.sp-product:hover{box-shadow:0 16px 28px #1d394019;transform:translateY(-4px)}.sp-product[hidden]{display:none}.sp-product-link{display:block;color:inherit}.sp-product-link:hover{color:inherit}.sp-product-image{height:190px;position:relative;background:#e8eeec;overflow:hidden}.sp-product-image img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .3s}.sp-product:hover img{transform:scale(1.04)}.sp-no-image{display:grid;place-items:center;height:100%;color:#a8babd;font-size:48px;background:linear-gradient(135deg,#ecf0ef,#dce5e3)}.sp-featured{position:absolute;top:12px;left:12px;background:#fff;color:#345369;border-radius:5px;padding:6px 9px;font-size:10px;font-weight:800;box-shadow:0 3px 12px #13262c16}.sp-product-body{padding:17px}.sp-product-meta{font-size:11px;color:#80919c;display:flex;justify-content:space-between;gap:8px}.sp-product-meta span:last-child{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.sp-product h3{font-size:14px;line-height:1.45;margin:11px 0 12px;height:40px;overflow:hidden;font-weight:800;color:var(--sp-ink)}.sp-product-price{color:#d7653e;font-weight:800;font-size:17px;min-height:24px}.sp-product-bottom{border-top:1px solid var(--sp-line);padding-top:12px;margin-top:15px;display:flex;justify-content:space-between;font-size:11px;color:#82929d}.sp-listings-bottom{text-align:center;margin-top:30px}.sp-more-button{display:inline-block;background:var(--sp-navy);color:#fff;padding:13px 24px;border-radius:8px;font-weight:700;font-size:13px}.sp-more-button:hover{background:#1d485f;color:#fff}.sp-empty{grid-column:1/-1;color:var(--sp-muted);padding:20px}.sp-why{background:#102d42;color:#fff;padding:54px 0}.sp-why-grid{display:grid;grid-template-columns:1.3fr repeat(3,1fr);gap:35px;align-items:center}.sp-why h2{color:#fff;font-size:29px;font-weight:800;line-height:1.3;margin:0}.sp-why p{color:#b6c9d1;font-size:13px;line-height:1.6;margin:9px 0 0}.sp-why-grid>div:not(:first-child){border-left:1px solid #ffffff29;padding-left:25px}.sp-why i{display:block;color:#ffae78;font-size:26px;margin-bottom:13px}.sp-why strong{font-size:15px;color:#fff}
/* The remaining templates and forms keep Classiera logic while sharing a calm visual system. */
body:not(.home) .inner-page-content,body:not(.home) .classiera-advertisement,body:not(.home) .classiera-single-post,body:not(.home) .classiera-category{background:#f7f9f9}.section-heading-v1 h3,.section-heading-v2 h3,.section-heading-v6 h3{color:var(--sp-navy);font-weight:800}.btn-primary,.btn-primary.active,.btn-primary:focus,.btn-primary:hover,.search-section button[type=submit],.search-form button[type=submit]{background-color:var(--sp-orange)!important;border-color:var(--sp-orange)!important;color:#fff!important}.btn,.form-control{border-radius:7px}.classiera-box-div,.classiera-box-div-v6,.category-box{border-radius:13px;overflow:hidden}.classiera-box-div{box-shadow:0 8px 28px #132f4110}.classiera-box-div .premium-img img{width:100%;object-fit:cover}.footer-bottom,footer.section-bg-black{background:#0d2637!important;color:#adbfca}.footer-bottom a,footer.section-bg-black a{color:#c9d7dc}.footer-bottom a:hover,footer.section-bg-black a:hover{color:#ffad79}.footer-bottom{border-top:1px solid #ffffff1c}.sp-header + section{clear:both}
@media(max-width:1100px){.sp-nav{gap:17px}.sp-menu-list{gap:16px}.sp-brand{font-size:17px}.sp-brand img{max-width:165px}.sp-nav-actions{gap:9px}.sp-account{font-size:12px}}
@media(max-width:900px){.sp-menu{display:none;position:absolute;top:100%;left:0;right:0;margin:0;background:#fff;padding:15px 24px;box-shadow:0 14px 22px #0002;max-height:70vh;overflow:auto}.sp-menu.is-open{display:block}.sp-menu-list{display:block}.sp-menu-list>li>a{padding:10px 0}.sp-menu-list .sub-menu{display:block;position:static;box-shadow:none;padding:0 0 0 20px}.sp-toggle{display:block}.sp-nav-actions{margin-left:auto}.sp-category-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.sp-product-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.sp-why-grid{grid-template-columns:repeat(2,1fr)}.sp-hero{height:530px}}
@media(max-width:640px){body.admin-bar .sp-header{top:46px}.sp-topline{display:none}.sp-nav{min-height:65px}.sp-brand{font-size:16px}.sp-brand img{max-width:145px;max-height:44px}.sp-account{display:none}.sp-post{font-size:11px;padding:10px}.sp-hero{height:620px;background-position:64% center}.sp-hero-content{align-items:flex-start;padding-top:75px}.sp-hero-copy{padding:0}.sp-hero h1{letter-spacing:-1px}.sp-hero p{font-size:14px;max-width:370px}.sp-search{flex-direction:column;bottom:-138px;padding:10px}.sp-field,.sp-field:first-child,.sp-field:nth-child(2),.sp-field:nth-child(3){flex:none;height:50px;border-right:0;border-bottom:1px solid var(--sp-line);padding:0 10px}.sp-field small{display:none}.sp-search button{min-height:43px;margin-top:7px}.sp-categories{padding-top:175px}.sp-category-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:11px}.sp-category{min-height:118px;padding:13px}.sp-heading h2{font-size:24px}.sp-heading{align-items:start}.sp-product-grid{gap:12px}.sp-product-image{height:145px}.sp-product-body{padding:12px}.sp-product h3{font-size:12px}.sp-product-price{font-size:14px}.sp-product-bottom{font-size:10px}.sp-tabs{display:none}.sp-why-grid{grid-template-columns:1fr}.sp-why-grid>div:not(:first-child){padding-left:20px}}
