/*
Theme Name: SDN Salaman 3
Author: SDN Salaman 3 Website
Description: Reproduksi desain website SDN Salaman 3 dari template Blogger ke WordPress.
Version: 1.1.0
Requires at least: 6.0
Requires PHP: 7.4
Text Domain: sdn-salaman3
*/
:root{--navy:#12315b;--blue:#1769aa;--gold:#f7bd45;--ink:#26364a;--muted:#68778b;--paper:#f5f8fc;--line:#e4ebf3;--white:#fff;--shadow:0 12px 30px rgba(18,49,91,.09)}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;color:var(--ink);font:16px/1.7 Arial,Helvetica,sans-serif;background:#fff}a{color:var(--blue);text-decoration:none}a:hover{color:var(--navy)}img{max-width:100%;height:auto}.container{width:min(1120px,calc(100% - 32px));margin:0 auto}
.topbar{background:var(--navy);color:#e8f2ff;font-size:12px;padding:8px 0}.topbar .container{display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap}.topbar a{color:white;margin-left:14px}
.header{background:#fff;border-bottom:1px solid var(--line)}.header-inner{min-height:84px;display:flex;align-items:center;justify-content:space-between;gap:20px;position:relative}.brand{display:flex;align-items:center;gap:12px;color:var(--navy)}.brand-logo{width:52px;height:52px;min-width:52px;border-radius:15px;background:#e7f3ff;display:grid;place-items:center;overflow:hidden}.brand-logo img{width:100%;height:100%;object-fit:contain}.brand-name{font-size:20px;font-weight:800;line-height:1.2;color:var(--navy)}.brand-sub{font-size:11px;color:var(--muted);margin-top:4px}.nav{display:flex;align-items:center;gap:5px;flex-wrap:wrap}.nav a{font-size:13px;font-weight:bold;color:#33445b;padding:10px 11px;border-radius:9px}.nav a:hover{background:#eaf5ff;color:var(--blue)}.nav .cta-link{background:var(--gold);color:var(--navy)}.menu-btn{display:none;border:0;border-radius:8px;padding:10px 13px;background:var(--navy);color:#fff;font-size:20px}
.hero{background:linear-gradient(120deg,#102c52,#1769aa);color:white;overflow:hidden}.hero-grid{display:grid;grid-template-columns:1.1fr .9fr;align-items:center;gap:36px;padding:64px 0}.eyebrow{display:inline-block;border:1px solid #ffffff45;background:#ffffff16;border-radius:99px;padding:6px 12px;font-size:11px;font-weight:bold;letter-spacing:1px;text-transform:uppercase}.hero h1{font-size:clamp(32px,4vw,50px);line-height:1.15;margin:18px 0;color:#fff;letter-spacing:-1px}.hero h1 span{color:var(--gold)}.hero p{color:#e2efff;max-width:600px}.buttons{display:flex;gap:10px;flex-wrap:wrap;margin-top:24px}.btn{display:inline-block;padding:11px 16px;border-radius:10px;font-size:13px;font-weight:bold}.btn-gold{background:var(--gold);color:var(--navy)}.btn-light{border:1px solid #ffffff80;color:#fff}.hero-art{background:#fff;padding:13px;border-radius:22px;box-shadow:0 24px 55px #071b344d;transform:rotate(1deg)}.school-scene{height:260px;border-radius:14px;display:flex;align-items:center;justify-content:center;position:relative;overflow:hidden;background:linear-gradient(#bce5ff 0 48%,#7ec777 48% 61%,#e4f1d8 61%)}.sun{position:absolute;right:25px;top:20px;width:42px;height:42px;border-radius:50%;background:#ffd365}.building{position:relative;width:76%;text-align:center;background:white;border:4px solid #dce7f0;border-bottom:8px solid #c7d6e5;padding:30px 10px 14px}.building:before{content:'';position:absolute;top:-20px;left:-12px;right:-12px;height:24px;background:#d94c4c;clip-path:polygon(8% 0,92% 0,100% 100%,0 100%)}.building strong{display:block;color:var(--navy);font-size:15px}.building small{color:var(--muted);font-size:10px}.windows{display:flex;justify-content:center;gap:8px;margin-top:12px}.windows i{width:25px;height:28px;background:#a5ddff;border:3px solid #d8e8f4}.art-caption{padding:11px 6px 1px;color:var(--navy);font-weight:bold;font-size:13px}
.stats{margin-top:-22px;position:relative}.stats-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}.stat{display:flex;align-items:center;gap:12px;background:#fff;border:1px solid var(--line);box-shadow:var(--shadow);border-radius:14px;padding:17px}.stat-icon{background:#eaf5ff;border-radius:16px;width:62px;height:62px;display:grid;place-items:center;flex:0 0 62px;font-size:28px}.stat strong{display:block;color:var(--navy);font-size:15px}.stat span:last-child{display:block;color:var(--muted);font-size:11px}
.section{padding:68px 0}.soft{background:var(--paper)}.section-kicker{color:var(--blue);font-size:11px;font-weight:bold;letter-spacing:1.5px;text-transform:uppercase}.section-title{color:var(--navy);font-size:clamp(25px,3vw,34px);line-height:1.25;margin:7px 0 12px}.section-desc{color:var(--muted);max-width:650px;margin:0 0 26px}.welcome-grid{display:grid;grid-template-columns:.8fr 1.2fr;gap:36px;align-items:center}.welcome-art{background:#e9f5ff;border-radius:22px;min-height:280px;display:grid;place-items:center;padding:22px}.welcome-card{background:#fff;border-radius:18px;padding:25px;text-align:center;box-shadow:var(--shadow);width:100%;max-width:320px}.avatar{width:68px;height:68px;border-radius:50%;display:grid;place-items:center;background:#eaf5ff;margin:0 auto 10px;font-size:30px}.welcome-card strong{display:block;color:var(--navy)}.welcome-card small{color:var(--muted)}.welcome-card p{font-size:13px;color:var(--muted)}.welcome-copy p{color:var(--muted)}.features{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}.feature{background:#fff;border:1px solid var(--line);border-radius:16px;padding:23px;display:block;transition:.2s}.feature:hover{transform:translateY(-3px);box-shadow:var(--shadow)}.feature-icon{font-size:25px;background:#eaf5ff;width:50px;height:50px;display:grid;place-items:center;border-radius:14px;margin-bottom:13px}.feature h3{color:var(--navy);font-size:17px;margin:0 0 7px}.feature p{font-size:13px;color:var(--muted);margin:0}
.news-heading{display:flex;align-items:end;justify-content:space-between;gap:15px;flex-wrap:wrap}.news-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.news-card{border:1px solid var(--line);border-radius:15px;background:white;overflow:hidden}.news-card .thumb{height:155px;display:grid;place-items:center;background:#eaf5ff;font-size:38px;overflow:hidden}.news-card .thumb img{width:100%;height:100%;object-fit:cover}.news-card .body{padding:18px}.news-card h3{font-size:17px;line-height:1.4;color:var(--navy);margin:0 0 8px}.news-card p{font-size:13px;color:var(--muted)}.more{font-size:12px;font-weight:bold}.notice{display:grid;grid-template-columns:1fr 1fr;gap:20px}.notice-panel{background:#fff;border:1px solid var(--line);border-radius:16px;padding:24px}.notice-panel h3{margin:0 0 12px;color:var(--navy)}.notice-panel p{font-size:13px;color:var(--muted)}.notice-cta{background:var(--navy);color:white;border-radius:16px;padding:28px}.notice-cta h3{font-size:24px;line-height:1.3;color:white;margin:10px 0}.notice-cta p{color:#dceaff;font-size:14px}.gallery{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}.gallery a{min-height:140px;background:#eaf5ff;border-radius:13px;display:grid;place-items:center;font-size:32px}
.footer{background:#0b2140;color:#d6e4f4;padding-top:45px}.footer-grid{display:grid;grid-template-columns:1.4fr .8fr .8fr;gap:30px;padding-bottom:30px}.footer h3{font-size:15px;color:white}.footer p,.footer a{font-size:13px;color:#b9cbe0}.footer-links{display:grid;gap:7px}.copyright{border-top:1px solid #ffffff20;padding:16px 0;font-size:12px;display:flex;justify-content:space-between;gap:10px;flex-wrap:wrap;color:#a9bed6}
.page-head{background:#eaf5ff;padding:30px 0}.page-head h1{margin:0;color:var(--navy);font-size:30px}.content-layout{display:grid;grid-template-columns:minmax(0,1fr) 270px;gap:24px;padding-top:35px;padding-bottom:60px}.post-outer,.post{background:white;border:1px solid var(--line);border-radius:15px;padding:22px;margin:0 0 18px;overflow:hidden}.post-title,.post-title a{font-size:25px;line-height:1.35;color:var(--navy);margin:0 0 12px}.post-header{margin-bottom:14px}.post-body{line-height:1.85;color:#3d4c60;overflow-wrap:anywhere}.post-body img{border-radius:10px}.post-body h2,.post-body h3{color:var(--navy)}.post-footer{border-top:1px solid var(--line);padding-top:12px;margin-top:18px;font-size:12px;color:var(--muted)}.sidebar .widget{padding:18px;border:1px solid var(--line);border-radius:14px;margin-bottom:16px}.sidebar .widget h2{font-size:16px;color:var(--navy);margin:0 0 12px}.sidebar ul{padding-left:18px}.sidebar li{margin:7px 0}
@media(max-width:900px){.header-inner{min-height:76px}.menu-btn{display:block}.nav{display:none;position:absolute;left:0;right:0;top:80px;z-index:20;background:#fff;border:1px solid var(--line);border-radius:13px;padding:10px;box-shadow:var(--shadow);flex-direction:column;align-items:stretch}.nav.open{display:flex}.nav a{padding:11px}.hero-grid{grid-template-columns:1fr .85fr;gap:22px}.stats-grid{grid-template-columns:repeat(2,1fr)}.content-layout{grid-template-columns:minmax(0,1fr) 230px}}
@media(max-width:650px){.container{width:calc(100% - 26px)}.topbar .container{display:block}.topbar a{margin-left:0;margin-right:12px}.brand-logo{width:44px;height:44px;flex-basis:44px}.brand-name{font-size:16px}.brand-sub{font-size:10px}.nav{top:70px}.hero-grid{grid-template-columns:1fr;padding:45px 0 52px}.hero h1{font-size:35px}.hero p{font-size:14px}.hero-art{max-width:430px}.school-scene{height:220px}.stats-grid{gap:8px}.stat{padding:12px 9px;gap:8px}.stat-icon{width:48px;height:48px;flex-basis:48px;font-size:23px}.stat strong{font-size:13px}.stat span:last-child{font-size:10px}.section{padding:48px 0}.welcome-grid,.notice{grid-template-columns:1fr}.features,.news-grid{grid-template-columns:1fr}.gallery{grid-template-columns:repeat(2,1fr)}.gallery a{min-height:125px}.footer-grid{grid-template-columns:1fr;gap:18px}.content-layout{grid-template-columns:1fr;padding-top:22px}.sidebar{order:2}.post-outer,.post{padding:17px}.post-title,.post-title a{font-size:21px}.page-head h1{font-size:25px}}
