/* v1.4.0: source photography, full service copy, transparent RAY identity. */
:root { --cyan:#008bbc; --blue:#08639b; --navy:#103957; --navy-deep:#0d2d46; --muted:#4e626e; }
body { font-size:18px; }
.site-header { background:#f4f9fc; box-shadow:0 3px 18px #10395712; }
.header-inner { min-height:94px; gap:20px; }
.brand img { width:92px; height:78px; background:transparent; padding:0; object-fit:contain; }
.brand-name strong { color:var(--navy); font-size:15px; }
.brand-name small { color:#526a78; font-size:13px; }
.nav { gap:23px; }
.nav > a { color:var(--navy); font-size:15px; }
.nav > a:hover { color:var(--cyan); }
.nav .nav-cta { color:#fff; background:var(--blue); }
.hero { grid-template-columns:1fr 1fr; min-height:620px; background:#f0f7fa; }
.hero-copy { background:linear-gradient(125deg,#096895,#008fbd); }
.hero-copy-inner { padding-top:68px; padding-bottom:56px; padding-right:48px; }
.hero h1 { font-size:clamp(38px,3.6vw,58px); line-height:1.13; letter-spacing:-.035em; }
.hero-copy p { font-size:18px; line-height:1.8; }
.hero-overline { font-size:13px; letter-spacing:.12em; }
.hero-caption { margin-top:34px; line-height:1.7; }
.hero-visual.hero-gallery { display:grid; grid-template-columns:1fr 1fr; gap:6px; min-height:100%; background:#d6eaf2; padding:6px 6px 6px 0; }
.hero-gallery::after { display:none; }
.hero-gallery figure { position:relative; margin:0; min-width:0; overflow:hidden; min-height:240px; }
.hero-gallery img { width:100%; height:100%; position:absolute; inset:0; object-fit:cover; object-position:center; }
.hero-gallery figure:nth-child(2) img { object-position:40% center; }
.hero-gallery figcaption { position:absolute; bottom:0; left:0; right:0; padding:35px 16px 15px; background:linear-gradient(transparent,#073657dd); font-size:15px; font-weight:700; color:white; }
.metric-grid { grid-template-columns:repeat(4,1fr); }
.metric-grid > div:last-child { border:0; }
.metric-grid strong { font-size:36px; }
.metric-grid small { font-size:13px; }
.section { padding:78px 0; }
.section h2,.sectors h2,.contact h2 { font-size:clamp(29px,3vw,43px); font-weight:800; letter-spacing:-.035em; }
.section p,.inner-lead,.inner-hero p { font-size:18px; }
.section-head p { max-width:420px; font-size:17px; }
.about-grid { gap:6%; }
.about-visual { min-height:390px; }
.about-visual > img { width:100%; height:auto; aspect-ratio:1.85; object-fit:contain; box-shadow:none; }
.about-quote { bottom:0; width:78%; min-height:155px; }
.about-quote p { font-size:16px; }
.service-photo-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:22px; }
.service-photo-grid article { background:white; border:1px solid #dce9ef; display:flex; flex-direction:column; min-width:0; }
.service-image { display:block; aspect-ratio:1.35; overflow:hidden; background:#eaf2f6; }
.service-image img { width:100%; height:100%; object-fit:cover; }
.service-photo-grid article:nth-child(2) .service-image img,.service-photo-grid article:nth-child(4) .service-image img,.service-photo-grid article:nth-child(5) .service-image img { object-fit:contain; }
.service-photo-grid article > div { padding:22px; display:flex; flex-direction:column; flex:1; }
.service-photo-grid h3 { font-size:21px; line-height:1.4; color:var(--navy); margin-bottom:12px; }
.service-photo-grid p { font-size:16px; line-height:1.75; margin-bottom:20px; }
.service-photo-grid .text-cta { margin-top:auto; font-size:15px; color:var(--blue); font-weight:800; }
.services-note p { font-size:16px; }
.strength-list p,.cleaning-flow p,.proof-grid p { font-size:16px; }
.strength-list h3 { font-size:20px; }
.strength-list article { padding:22px 4px; }
.strengths-grid { gap:7%; }
.method-grid { grid-template-columns:repeat(4,1fr); gap:12px; background:none; border:0; }
.method-grid li { padding:22px; }
.method-grid strong { font-size:15px; }
.method-grid p { font-size:16px; }
.method-grid li > span { margin-bottom:18px; }
.training-image { padding:0; }
.training-image::before { display:none; }
.training-image > img { height:auto; aspect-ratio:1.61; object-fit:contain; }
.training-grid { gap:6%; }
.training-points > div { grid-template-columns:120px 1fr; }
.training-points p { font-size:16px; }
.training-grid .text-cta { color:var(--blue); font-weight:800; font-size:16px; }
.dashboard-illustration { transform:none; }
.partner-showcase { background:#f4f9fc; }
.client-logo-grid { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:16px; margin:28px 0 32px; }
.client-logo-grid figure { margin:0; background:white; min-width:0; border:1px solid #e0e9ee; padding:20px 12px 15px; text-align:center; }
.client-logo-grid img { width:100%; height:75px; object-fit:contain; }
.client-logo-grid figcaption { font-size:14px; line-height:1.5; color:#526572; margin-top:16px; }
.footer { background:#eaf3f8; color:var(--navy); }
.footer-brand img { width:94px; height:80px; background:transparent; padding:0; object-fit:contain; }
.footer-brand strong,.footer-main > div > strong,.footer p,.footer a,.footer span { color:var(--navy); }
.footer-main { border-color:#cbdde7; }
.footer-bottom { color:#526572; border-color:#cbdde7; }
.inner-hero { padding:62px 0; }
.inner-hero h1 { font-size:clamp(33px,3.5vw,50px); font-weight:800; line-height:1.2; }
.inner-hero img { height:auto; max-height:390px; object-fit:contain; box-shadow:none; }
.inner-section { padding:65px 0; }
.inner-section h2 { font-size:clamp(28px,2.8vw,40px); }
.info-card p,.info-card li,.address-grid p { font-size:17px; }
.info-card { padding:26px; }
.service-detail p { font-size:18px; }
.service-detail img { height:auto; max-height:430px; object-fit:contain; }
.documentary-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(230px,1fr)); gap:24px; margin-top:34px; }
.documentary-grid figure { margin:0; padding:0; min-width:0; }
.documentary-grid img { width:100%; height:280px; object-fit:contain; background:#eaf1f5; }
.documentary-grid figcaption { font-size:16px; color:#526572; padding-top:12px; }
.organization-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:24px; }
.organization-grid figure { margin:0; padding:26px; background:white; border:1px solid var(--line); }
.organization-grid figure:first-child { grid-column:1/-1; }
.organization-grid h3 { color:var(--navy); font-size:20px; }
.organization-grid img { max-width:100%; width:auto; max-height:800px; height:auto; margin:auto; object-fit:contain; }
.organization-grid figcaption { font-size:16px; color:var(--muted); margin-top:18px; text-align:center; }
.seven-detail { display:grid; grid-template-columns:1fr 1fr; gap:20px; margin-top:32px; }
.seven-detail article { display:flex; gap:22px; background:white; padding:30px; border:1px solid var(--line); }
.seven-detail article > span { color:var(--cyan); font:800 28px/1.3 Montserrat,Arial,sans-serif; }
.seven-detail h3 { color:var(--navy); font-size:21px; margin:0 0 13px; }
.seven-detail p { color:var(--muted); font-size:17px; margin:0; line-height:1.85; }
.section-action { margin-top:28px; }
.training-catalog { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:22px; margin-top:32px; align-items:start; }
.training-catalog article { padding:28px; background:white; border:1px solid var(--line); border-top:4px solid var(--cyan); }
.training-catalog h3 { color:var(--navy); font-size:21px; line-height:1.45; }
.training-catalog ul { margin:0; padding-left:19px; color:var(--muted); font-size:17px; }
.training-catalog li { margin-top:8px; }
.partner-hero p { max-width:800px; }
.partner-group { margin-bottom:16px; border:1px solid #cfdee7; background:white; }
.partner-group summary { cursor:pointer; padding:22px 26px; color:var(--navy); font:700 19px/1.5 Montserrat,Arial,sans-serif; }
.partner-group summary::marker { color:var(--cyan); }
.partner-group ul { list-style:none; display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:0 25px; margin:0; padding:0 26px 26px; }
.partner-group li { border-top:1px solid #e5eef3; padding:12px 0; font-size:16px; color:var(--muted); }
@media(max-width:1150px) {
 .nav { gap:14px; } .brand-name strong{font-size:14px;} .brand img{width:76px;}
 .service-photo-grid {grid-template-columns:repeat(2,minmax(0,1fr));}
 .hero-copy-inner {padding-right:28px;} .hero-gallery figcaption{font-size:14px;padding-inline:10px;}
}
@media(max-width:1000px) {
 .nav {display:none;position:absolute;top:100%;left:0;right:0;padding:15px 24px 24px;background:#f4f9fc;box-shadow:0 12px 18px #10395715;}
 .nav.is-open {display:flex;flex-direction:column;align-items:stretch;gap:0;}
 .nav > a {padding:13px 6px;border-top:1px solid #d5e4ec;}
 .nav .nav-cta {justify-content:center;margin-top:12px;}
 .menu-toggle {display:flex;flex-direction:column;gap:5px;align-items:center;justify-content:center;width:43px;height:43px;border:1px solid #8aa9ba;background:transparent;padding:9px;}
 .menu-toggle span{display:block;width:22px;height:2px;background:var(--navy);}
 .hero {grid-template-columns:1fr;}
 .hero-copy-inner {width:100%;padding:55px max(24px,calc((100vw - 740px)/2));}
 .hero h1 {font-size:50px;} .hero-copy p{max-width:660px;}
 .hero-gallery.hero-visual{min-height:470px;padding:6px;grid-template-columns:repeat(4,1fr);}
 .hero-gallery figure{min-height:300px;} .hero-gallery.hero-visual{min-height:300px;}
 .inner-hero-grid,.detail-split{grid-template-columns:1fr;gap:32px;}
 .inner-hero img{max-height:360px;}
 .client-logo-grid{grid-template-columns:repeat(4,minmax(0,1fr));}
 .training-catalog{grid-template-columns:repeat(2,minmax(0,1fr));}
 .partner-group ul{grid-template-columns:repeat(2,minmax(0,1fr));}
 .about-visual{min-height:350px;}
}
@media(max-width:620px) {
 body{font-size:17px;} .header-inner{min-height:80px;}
 .brand img{width:74px;height:66px;} .brand-name strong{font-size:13px;}
 .hero-copy-inner{padding:42px 20px;} .hero h1{font-size:clamp(33px,9.5vw,49px);}
 .hero-copy p{font-size:17px;} .hero-overline{font-size:13px;}
 .hero-gallery.hero-visual{grid-template-columns:1fr 1fr;min-height:440px;}
 .hero-gallery figure{min-height:220px;}
 .metric-grid{grid-template-columns:1fr 1fr;row-gap:22px;padding:25px 0;}
 .metric-grid > div{padding:0 18px!important;border-right:0;}
 .metric-grid strong{font-size:31px;} .metric-grid small{font-size:13px;}
 .section,.inner-section,.inner-hero{padding:50px 0;}
 .service-photo-grid{grid-template-columns:1fr;gap:25px;}
 .service-image{aspect-ratio:1.65;}
 .service-photo-grid article > div{padding:23px;}
 .service-photo-grid p{font-size:17px;}
 .about-visual{min-height:0;display:block;}
 .about-visual > img{aspect-ratio:auto;height:auto;width:100%;}
 .about-quote{position:static;width:100%;min-height:0;margin-top:14px;}
 .method-grid{grid-template-columns:1fr 1fr;gap:10px;}
 .method-grid li{padding:17px;} .method-grid strong{font-size:13px;}
 .section p{font-size:17px;}
 .client-logo-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;}
 .client-logo-grid img{height:65px;}
 .organization-grid,.seven-detail,.training-catalog{grid-template-columns:1fr;}
 .organization-grid figure:first-child{grid-column:auto;}
 .organization-grid figure{padding:16px;}
 .seven-detail article{padding:24px;gap:16px;}
 .partner-group ul{grid-template-columns:1fr;padding:0 20px 20px;}
 .partner-group summary{font-size:17px;padding:20px;}
 .documentary-grid{grid-template-columns:1fr;}
 .documentary-grid img{height:auto;max-height:420px;}
 .footer-brand img{width:90px;height:76px;}
}

.footer .footer-brand strong { color:var(--navy); }
.training-catalog { align-items:stretch; }
.client-logo-grid img[src$="mitra-unisi.png"] { transform:rotate(-90deg) scale(1.7); }

/* 1.4.1 — visual kampanye pilihan pengguna; teks tetap aksesibel. */
.hero.hero-campaign { display:block; min-height:760px; background:#092f4e; padding:70px max(24px,calc((100vw - 1340px)/2)) 150px; }
.campaign-scene { position:absolute; top:0; right:0; width:82%; height:100%; object-fit:cover; object-position:center; }
.campaign-shade { position:absolute; inset:0; background:linear-gradient(90deg,#092f4e 0%,#092f4efa 19%,#092f4edb 30%,#092f4e55 43%,transparent 59%),linear-gradient(0deg,#092f4eaa,transparent 30%); }
.campaign-content { position:relative; z-index:1; width:38%; max-width:490px; color:white; }
.campaign-content .hero-overline { font-size:13px; line-height:1.6; letter-spacing:.18em; }
.hero-campaign h1 { font-size:clamp(32px,3.2vw,54px); margin:26px 0 20px; line-height:1.08; }
.hero-campaign h1 em { color:#80d7ff; }
.campaign-content > p { color:#f3f9ff; font-size:17px; line-height:1.75; }
.campaign-benefits { padding:0; margin:22px 0 26px; list-style:none; display:flex; flex-wrap:wrap; gap:12px 18px; }
.campaign-benefits li { font-size:15px; font-weight:700; color:white; }
.campaign-benefits span { color:#83ddff; margin-right:5px; }
.campaign-cta { background:#008bd1; color:white; border-radius:28px; padding:17px 23px; font-size:15px; }
.campaign-cta:hover { background:#006da8; color:white; }
.campaign-content .campaign-motto { font-size:14px; line-height:1.65; margin:22px 0 0; max-width:380px; color:#d7e9f5; }
.campaign-services { position:absolute; z-index:1; left:max(24px,calc((100vw - 1340px)/2)); right:max(24px,calc((100vw - 1340px)/2)); bottom:24px; display:grid; grid-template-columns:1.35fr .8fr 1.3fr 1fr 1fr; background:#073657dd; border:1px solid #9dd6f6a6; border-radius:16px; padding:23px 10px; backdrop-filter:blur(8px); }
.campaign-services a { padding:0 20px; color:white; border-right:1px solid #c2e6fa66; }
.campaign-services a:last-child { border:0; }
.campaign-services strong { display:block; font-size:15px; line-height:1.5; }
.campaign-services span { display:block; font-size:14px; line-height:1.6; margin-top:5px; color:#deeffa; }
.campaign-services a:hover strong { color:#80d7ff; }
.service-photo-grid .service-image { aspect-ratio:1; }
.service-photo-grid article .service-image img { object-fit:cover; object-position:center; }
@media(max-width:1000px) {
 .hero.hero-campaign {padding:490px 28px 28px;min-height:0;}
 .campaign-scene {width:100%;height:460px;object-position:center;}
 .campaign-shade {background:linear-gradient(0deg,#092f4e 0%,#092f4e 48%,transparent 75%);}
 .campaign-content {width:100%;max-width:650px;}
 .hero-campaign h1 {font-size:48px;}
 .campaign-services {position:relative;left:auto;right:auto;bottom:auto;margin-top:32px;grid-template-columns:repeat(3,1fr);gap:22px 0;}
 .campaign-services a {border:0;}
}
@media(max-width:620px) {
 .hero.hero-campaign {padding:235px 20px 24px;}
 .campaign-scene {height:auto;aspect-ratio:1.88;object-fit:contain;}
 .campaign-shade {background:linear-gradient(0deg,#092f4e 0%,#092f4e 69%,transparent 88%);}
 .hero-campaign h1 {font-size:clamp(30px,8.6vw,48px);}
 .campaign-content .hero-overline {font-size:13px;}
 .campaign-content > p {font-size:16px;}
 .campaign-benefits {gap:12px;font-size:14px;}
 .campaign-services {grid-template-columns:1fr 1fr;padding:20px 4px;gap:20px 0;}
 .campaign-services a {padding:0 12px;}
 .campaign-services strong {font-size:14px;}
 .campaign-services span {font-size:13px;}
}

@media(max-width:620px) {
}

/* 1.4.3 — keterangan lambang Polri. */

/* 1.5.3 — logo identitas di dalam gambar hero; bingkai layanan sejajar kontainer situs. */
.campaign-badges { position:absolute; z-index:2; right:max(24px,calc((100vw - 1340px)/2)); bottom:170px; display:flex; align-items:stretch; gap:12px; }
.cbadge { display:flex; flex-direction:column; align-items:center; justify-content:center; gap:4px; width:150px; height:96px; padding:10px 14px; border-radius:12px; box-shadow:0 8px 24px #0006; }
.cbadge img { display:block; max-width:100%; max-height:62px; object-fit:contain; }
.cbadge-dark { background:#103957ee; }
a.cbadge { width:210px; }
a.cbadge:hover { background:#16507a; outline:3px solid #80d7ff; }
.cbadge-polri img { max-height:56px; }
.cbadge strong { color:#fff; font-size:13px; line-height:1.2; }
@media(max-width:1000px) {
 .campaign-badges { right:28px; bottom:auto; top:290px; gap:8px; }
 .cbadge { width:120px; height:78px; padding:7px 10px; }
 a.cbadge { width:160px; }
 .cbadge img { max-height:46px; }
}
@media(max-width:620px) {
 .campaign-badges { right:12px; left:12px; top:auto; bottom:auto; justify-content:center; top:calc(100vw * .53 - 62px); gap:6px; }
 .cbadge { width:auto; flex:1 1 0; height:56px; padding:5px 6px; border-radius:8px; }
 a.cbadge { flex:1.5 1 0; width:auto; }
 .cbadge img { max-height:34px; }
 .cbadge-polri img { max-height:28px; }
 .cbadge strong { font-size:11px; }
}

/* 1.6.0 — halaman Sistem Absensi RAY ONE (data fiktif, ilustrasi buatan sendiri). */
.abs-phone { max-width:330px; margin:0 auto; padding:18px; border-radius:30px; background:#0c3050; border:6px solid #16507a; color:#fff; box-shadow:0 20px 50px #0a2a4466; }
.abs-phone-top { display:flex; justify-content:space-between; align-items:center; font-size:15px; } .abs-phone-top span { color:#9fd8f2; }
.abs-clock { font:900 40px/1.3 Montserrat,Arial,sans-serif; text-align:center; margin:14px 0 10px; letter-spacing:.02em; }
.abs-geo { display:grid; grid-template-columns:repeat(3,1fr); gap:6px; margin-bottom:14px; }
.abs-geo div { background:#103f66; border-radius:10px; padding:9px 6px; text-align:center; } .abs-geo small { display:block; font-size:11px; letter-spacing:.06em; color:#9fd8f2; } .abs-geo b { font-size:16px; }
.abs-geo .abs-ok b { color:#6ee7a3; }
.abs-btn { border-radius:14px; padding:14px 16px; font:800 16px/1.3 Montserrat,Arial,sans-serif; margin-bottom:10px; } .abs-btn small { display:block; font:400 13px/1.4 Inter,Arial,sans-serif; opacity:.85; margin-top:2px; }
.abs-btn-in { background:#0a8f5a; } .abs-btn-out { background:#c4462f; }
.abs-btn-row { display:grid; grid-template-columns:1fr 1fr; gap:8px; } .abs-btn-row span { background:#103f66; border-radius:12px; padding:11px 6px; text-align:center; font-size:14px; font-weight:700; }
.abs-note { margin:26px 0 0; padding:18px 22px; background:#fff; border-left:5px solid var(--cyan); font-size:17px; line-height:1.75; color:var(--muted); }
.abs-dash { background:#fff; border:1px solid var(--line); border-radius:14px; box-shadow:var(--shadow); overflow:hidden; margin-bottom:22px; }
.abs-dash-bar { display:flex; align-items:center; gap:10px; padding:14px 20px; background:#0c3050; color:#fff; font-size:16px; } .abs-dash-bar em { margin-left:auto; font-style:normal; font-size:14px; color:#9fd8f2; }
.abs-tiles { display:grid; grid-template-columns:repeat(4,1fr); gap:14px; padding:20px; }
.abs-tiles div { background:#f5fbfe; border-top:4px solid var(--cyan); padding:16px; } .abs-tiles small { display:block; font-size:12px; letter-spacing:.06em; color:var(--muted); } .abs-tiles b { display:block; font:900 32px/1.3 Montserrat,Arial,sans-serif; color:var(--navy); } .abs-tiles i { font-style:normal; font-size:14px; color:var(--muted); }
.abs-dash-grid { display:grid; grid-template-columns:1fr 1fr; gap:20px; padding:0 20px 22px; }
.abs-chart strong { display:block; margin-bottom:10px; color:var(--navy); font-size:16px; }
.abs-bars { display:flex; align-items:flex-end; gap:12px; height:190px; padding:10px 8px 28px; border-bottom:2px solid var(--line); }
.abs-bars span { position:relative; flex:1; height:var(--h); background:linear-gradient(0deg,#087fb6,#4cc2ea); border-radius:6px 6px 0 0; } .abs-bars i { position:absolute; bottom:-24px; left:0; right:0; text-align:center; font-style:normal; font-size:14px; color:var(--muted); }
.abs-table { width:100%; border-collapse:collapse; font-size:16px; } .abs-table th { text-align:left; font-size:13px; letter-spacing:.05em; color:var(--muted); padding:8px 10px; border-bottom:2px solid var(--line); } .abs-table td { padding:11px 10px; border-bottom:1px solid var(--line); color:var(--navy); } .abs-table td:last-child { font-weight:800; }
.abs-pair { margin-top:0; } .abs-list { list-style:none; margin:0; padding:0; } .abs-list li { display:flex; gap:12px; align-items:baseline; padding:10px 0; border-bottom:1px solid var(--line); font-size:16px; } .abs-list li:last-child { border:0; } .abs-list b { color:var(--cyan); min-width:52px; } .abs-list span { margin-left:auto; font-size:14px; color:var(--muted); }
.abs-ba { display:grid; grid-template-columns:1fr 1fr; gap:12px; margin-bottom:12px; } .abs-ba div { height:130px; display:flex; align-items:flex-end; padding:10px; border-radius:10px; background:repeating-linear-gradient(135deg,#dfe9ee 0 12px,#e9f1f5 12px 24px); } .abs-ba div.ok { background:repeating-linear-gradient(135deg,#d3eef9 0 12px,#e6f6fc 12px 24px); } .abs-ba span { font:800 13px/1 Montserrat,Arial,sans-serif; letter-spacing:.08em; color:var(--navy); background:#fff; padding:6px 9px; border-radius:6px; }
@media(max-width:1000px) { .abs-tiles { grid-template-columns:repeat(2,1fr); } .abs-dash-grid { grid-template-columns:1fr; } }
@media(max-width:620px) { .abs-phone { max-width:100%; } .abs-tiles { padding:14px; gap:10px; } .abs-tiles b { font-size:26px; } .abs-dash-bar em { display:none; } .abs-dash-grid { padding:0 14px 18px; } .abs-bars { gap:7px; } }

/* 1.6.1 — tangkapan layar aplikasi karyawan (akun demo) + panel admin dibangun ulang dengan data fiktif. */
.abs-shot { margin:0 auto; max-width:310px; } .abs-shot img { display:block; width:100%; height:auto; max-height:none; border-radius:26px; border:6px solid #0c3050; box-shadow:0 20px 50px #0a2a4466; } .abs-shot figcaption { margin-top:12px; text-align:center; font-size:14px; color:var(--muted); }
.am-stack { display:grid; grid-template-columns:minmax(0,1fr); gap:34px; } .am-stack figure { margin:0; } .am-stack figcaption { margin-top:10px; font-size:15px; color:var(--muted); }
.am-win { background:#eef1f7; border:1px solid var(--line); border-radius:12px; box-shadow:var(--shadow); overflow:hidden; font-size:15px; }
.am-bar { display:flex; align-items:center; gap:12px; flex-wrap:wrap; padding:12px 18px; background:#fff; border-bottom:1px solid var(--line); } .am-bar strong { color:#1c2d55; font-size:17px; } .am-bar i { font:600 12px/1 ui-monospace,Menlo,monospace; border:1px solid var(--line); border-radius:12px; padding:4px 9px; color:#52607a; font-style:normal; } .am-bar span { margin-left:auto; color:#52607a; font-size:14px; }
.am-tabs { display:flex; gap:22px; overflow-x:auto; padding:0 18px; background:#fff; border-bottom:1px solid var(--line); } .am-tabs span { padding:13px 0; font-weight:600; color:#7a8499; white-space:nowrap; border-bottom:3px solid transparent; } .am-tabs span.on { color:#1c2d55; border-color:#1c2d55; }
.am-body { padding:18px; display:grid; gap:16px; } .am-tiles { display:grid; grid-template-columns:repeat(5,1fr); gap:12px; } .am-tiles.two { grid-template-columns:repeat(2,1fr); }
.am-tiles div { background:#fff; border-left:4px solid #1c2d55; border-radius:8px; padding:12px 14px; color:#52607a; font-size:14px; box-shadow:0 1px 4px #0001; } .am-tiles b { display:block; font:800 28px/1.2 Inter,Arial,sans-serif; color:#1c2d55; }
.am-card { background:#fff; border-radius:10px; padding:16px 18px; box-shadow:0 1px 4px #0001; } .am-card h4 { margin:0 0 12px; color:#1c2d55; font-size:17px; } .am-sub { margin:-6px 0 10px; color:#52607a; font-size:14px; } .am-select { display:inline-block; border:1px solid var(--line); border-radius:6px; padding:8px 14px; min-width:220px; background:#fafbfd; }
.am-scroll { overflow-x:auto; } .am-card table { width:100%; min-width:560px; border-collapse:collapse; } .am-card th { text-align:left; font-size:12px; letter-spacing:.05em; text-transform:uppercase; color:#7a8499; padding:8px 10px; border-bottom:1px solid var(--line); vertical-align:bottom; } .am-card th small { display:block; text-transform:none; letter-spacing:0; font-weight:400; font-size:11px; } .am-card td { padding:10px; border-bottom:1px solid #eef1f6; color:#1c2d55; font-size:15px; } .am-card tr:last-child td { border:0; }
.am-pill { display:inline-block; font:600 13px/1 ui-monospace,Menlo,monospace; padding:6px 10px; border-radius:12px; } .am-pill.g { background:#e3f4ea; color:#1f7a4a; } .am-pill.r { background:#fbe6e1; color:#b8402b; }
.am-chart { display:flex; align-items:flex-end; gap:6%; height:150px; padding:0 4% 26px; border-bottom:1px solid var(--line); } .am-grp { position:relative; flex:1; display:flex; align-items:flex-end; justify-content:center; gap:4px; height:100%; } .am-grp span { width:10px; border-radius:2px 2px 0 0; } .am-grp .g { background:#3a9a5c; } .am-grp .r { background:#c9503a; } .am-grp i { position:absolute; bottom:-24px; left:50%; transform:translateX(-50%); font:12px/1 ui-monospace,Menlo,monospace; color:#7a8499; font-style:normal; white-space:nowrap; }
.am-leg { margin:10px 0 0; font-size:13px; color:#52607a; } .am-leg span { display:inline-block; width:10px; height:10px; border-radius:2px; margin:0 5px 0 12px; } .am-leg span.g { background:#3a9a5c; margin-left:0; } .am-leg span.r { background:#c9503a; }
@media(max-width:1000px) { .am-tiles { grid-template-columns:repeat(3,1fr); } }
@media(max-width:620px) { .am-tiles { grid-template-columns:repeat(2,1fr); } .am-body { padding:12px; } .am-bar span { margin-left:0; } .abs-shot { max-width:280px; } }

/* 1.7.0 — headline terintegrasi AI: percakapan contoh (data fiktif) dan blok absensi di beranda. */
.ai-chat { background:#fff; border:1px solid var(--line); border-radius:14px; box-shadow:var(--shadow); overflow:hidden; font-size:15px; min-width:0; }
.ai-chat-top { display:flex; align-items:center; gap:10px; padding:13px 18px; background:#0c3050; color:#fff; font-size:16px; } .ai-chat-top em { margin-left:auto; font-style:normal; font-size:13px; color:#9fd8f2; }
.ai-msg { margin:14px 16px 0; padding:11px 14px; border-radius:12px; line-height:1.55; } .ai-msg.user { margin-left:auto; max-width:82%; background:#1c2d55; color:#fff; } .ai-msg.bot { max-width:94%; background:#eef6fb; border:1px solid var(--line); color:#1c2d55; } .ai-msg p { margin:0 0 8px; }
.ai-msg table { width:100%; border-collapse:collapse; font-size:14px; } .ai-msg th,.ai-msg td { border:1px solid #d7e3ec; padding:6px 9px; text-align:left; } .ai-msg th { background:#e2eef6; }
.ai-input { display:flex; align-items:center; gap:10px; margin:16px; padding:10px 12px; border:1px solid var(--line); border-radius:10px; color:#8a95a8; } .ai-input b { margin-left:auto; background:#1c2d55; color:#fff; border-radius:8px; padding:8px 14px; font-size:14px; }
.home-abs { display:grid; grid-template-columns:200px minmax(0,1fr); gap:20px; align-items:center; } .home-abs .abs-shot { max-width:200px; } .home-abs .abs-shot img { border-width:4px; border-radius:20px; }
@media(max-width:1000px) { .home-abs { grid-template-columns:minmax(0,1fr); } .home-abs .abs-shot { margin:0 auto; } }

/* 1.7.1 — skala huruf seragam antar halaman: teks pengantar 18px, teks isi dan daftar 17px, keterangan gambar 15px.
   Komponen dengan skala sendiri (hero, ilustrasi dashboard, percakapan AI, mock admin) dikecualikan. */
main :is(p, li):where(:not(:is(.hero, .hero-campaign, .campaign-content, .campaign-services, .dashboard-illustration, .ai-chat, .am-win, .abs-phone, .method-grid, .metric-band, .sector-tags) *, .waste-note, .am-sub, .am-leg, .abs-note)) { font-size:17px !important; }
main :is(.inner-lead, .inner-hero p, .section-head > p, .strengths-grid > div:first-child > p, .digital-grid > div > p, .about-intro p, .method-head > p) { font-size:18px !important; }
main figcaption { font-size:15px !important; }
.info-card h3 { font-size:20px; }
.text-cta, .method-more { font-size:16px; }

/* 1.8.0 — lambang mitra menggantikan tulisan; logo besar di beranda. */
.logo-wall { display:grid; grid-template-columns:repeat(auto-fill,minmax(150px,1fr)); gap:14px; margin:18px 22px 8px; }
.logo-tile { margin:0; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:8px; min-height:120px; padding:16px 14px; background:#fff; border:1px solid #e0e9ee; border-radius:10px; text-align:center; }
.logo-tile img { display:block; width:auto; max-width:100%; height:auto; max-height:84px; object-fit:contain; }
.logo-tile figcaption { font-size:14px; line-height:1.4; color:#526572; }
.partner-more { margin:18px 22px 6px; font:700 13px/1.4 Montserrat,Arial,sans-serif; letter-spacing:.08em; text-transform:uppercase; color:#526572; }
.home-logos { list-style:none; margin:30px 0 28px; padding:0; display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:18px; }
.home-logos .logo-tile { min-height:200px; padding:24px 18px; border-radius:14px; box-shadow:0 4px 18px #0a2a4410; }
.home-logos .logo-tile img { max-height:120px; }
.home-logos .logo-tile figcaption { font:700 15px/1.35 Montserrat,Arial,sans-serif; color:#1c2d55; }
@media(max-width:1000px) { .home-logos { grid-template-columns:repeat(3,minmax(0,1fr)); } }
@media(max-width:620px) { .logo-wall { grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; margin-inline:12px; } .partner-more { margin-inline:12px; } .home-logos { gap:12px; } .home-logos { grid-template-columns:repeat(2,minmax(0,1fr)); } .home-logos .logo-tile { min-height:140px; padding:16px 10px; } .home-logos .logo-tile img { max-height:84px; } .home-logos .logo-tile figcaption { font-size:14px; } }
/* 1.8.2 — logo utama di halaman Mitra. */
.inner-section > .container > .section-label + .home-logos { margin-top:14px; }
.inner-section > .container > .home-logos + .section-label { display:block; margin-top:26px; }
/* 1.8.5 — daftar pelatihan dan tahapan 7P di beranda ikut skala huruf seragam. */
.training-points strong { font-size:16px; }
.training-points span, .training-points p { font-size:17px; line-height:1.65; }
.training-image > div strong { font-size:16px; } .training-image > div span { font-size:14px; }
.method-grid strong { font-size:16px; } .method-grid p { font-size:17px; }
@media(max-width:620px) { .method-grid strong { font-size:15px; } }
/* 1.8.6 — teks bantu (keterangan gambar, tombol, label bagian) tidak lebih kecil dari 16/15px. */
main figcaption { font-size:16px !important; }
.button, .text-cta, .method-more, .contact-actions a, .contact-detail a { font-size:16px; }
.section-label { font-size:15px; }
.about-quote strong { font-size:15px; }
a[href$="#legalitas"] { font-size:16px; }
/* 1.8.7 — judul tiap layanan sama besar dengan judul bagian di halaman lain; menu jenis layanan 16px. */
.service-detail h2 { font-size:clamp(28px,2.8vw,40px); line-height:1.2; letter-spacing:-.04em; }
.detail-nav a { font-size:16px; }
/* 1.8.8 — foto kantor pusat & cabang pada kartu alamat. */
.address-grid article { padding:0; overflow:hidden; }
.address-grid article h3 { margin:18px 20px 9px; }
.address-grid article p { margin:0 20px 20px; }
.office-photo { display:block; width:100%; height:auto; aspect-ratio:4/3; object-fit:cover; background:#e9edf2; }
.office-photo-logo { display:flex; align-items:center; justify-content:center; background:#0e1b2c; }
.office-photo-logo img { width:34%; height:auto; aspect-ratio:1; object-fit:contain; }

/* 1.8.9 — lambang RAY di footer menjadi tautan ke presentasi. */
.footer-logo-link { display:block; line-height:0; border-radius:8px; }
.footer-logo-link:hover img { opacity:.85; }

/* foto tim (joglo) di profil: tampil utuh tanpa batas tinggi */
.inner-hero img.foto-tim { max-height:none; object-fit:cover; }
.about-visual > img.foto-tim { aspect-ratio:auto; height:auto; object-fit:cover; }
.about-visual:has(> img.foto-tim) { display:block; min-height:0; }
.about-visual:has(> img.foto-tim) .about-quote { position:static; width:100%; min-height:0; }
