/* Suruh.id Interactive Pages — scoped so it does not disturb the rest of the theme */
.sip-enhanced-page .entry-title,
.sip-enhanced-page .page-title,
.sip-enhanced-page .wp-block-post-title {
	display: none !important;
}

.sip-enhanced-page .entry-content,
.sip-enhanced-page .site-main,
.sip-enhanced-page main {
	overflow: visible;
}

.sip-shell {
	--sip-bg: #f7f8fb;
	--sip-surface: #ffffff;
	--sip-text: #121826;
	--sip-muted: #687083;
	--sip-line: #e5e8ef;
	--sip-brand: #5b35f5;
	--sip-brand-2: #7a5cff;
	--sip-brand-soft: #f0edff;
	--sip-good: #1e9d67;
	--sip-bad: #d45252;
	--sip-shadow: 0 22px 70px rgba(18, 24, 38, .10);
	--sip-radius: 28px;
	color: var(--sip-text);
	width: min(1180px, calc(100% - 32px));
	margin: 0 auto;
	padding: 32px 0 80px;
	font-size: 16px;
	line-height: 1.65;
}

.sip-shell *,
.sip-shell *::before,
.sip-shell *::after { box-sizing: border-box; }

.sip-shell h1,
.sip-shell h2,
.sip-shell h3,
.sip-shell p { margin-top: 0; }

.sip-shell h1,
.sip-shell h2,
.sip-shell h3 {
	color: var(--sip-text);
	line-height: 1.1;
	letter-spacing: -.035em;
}

.sip-shell h1 { font-size: clamp(42px, 6vw, 76px); margin-bottom: 24px; max-width: 760px; }
.sip-shell h2 { font-size: clamp(32px, 4.2vw, 54px); margin-bottom: 18px; }
.sip-shell h3 { font-size: 20px; margin-bottom: 10px; }
.sip-shell p { color: var(--sip-muted); }

.sip-shell a { text-decoration: none; }
.sip-icon { width: 22px; height: 22px; display: block; flex: 0 0 auto; }

.sip-eyebrow {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	font-size: 12px;
	line-height: 1;
	font-weight: 800;
	letter-spacing: .13em;
	text-transform: uppercase;
	color: var(--sip-brand);
	margin-bottom: 18px;
}

.sip-hero {
	position: relative;
	display: grid;
	grid-template-columns: minmax(0, 1.05fr) minmax(360px, .95fr);
	gap: 64px;
	align-items: center;
	min-height: 690px;
	padding: 58px;
	border-radius: 36px;
	background:
		radial-gradient(circle at 12% 10%, rgba(122,92,255,.18), transparent 28%),
		linear-gradient(145deg, #fff 0%, #f7f5ff 52%, #eef0ff 100%);
	border: 1px solid #ece9ff;
	overflow: hidden;
}

.sip-hero::after {
	content: "";
	position: absolute;
	width: 360px;
	height: 360px;
	border: 1px solid rgba(91,53,245,.12);
	border-radius: 50%;
	right: -160px;
	top: -140px;
	box-shadow: 0 0 0 70px rgba(91,53,245,.035), 0 0 0 140px rgba(91,53,245,.02);
	pointer-events: none;
}

.sip-hero__content { position: relative; z-index: 2; }
.sip-hero h1 span { color: var(--sip-brand); }
.sip-lead { font-size: clamp(18px, 2vw, 21px); max-width: 700px; margin-bottom: 30px; }

.sip-actions { display: flex; flex-wrap: wrap; gap: 12px; margin: 28px 0 30px; }

.sip-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 10px;
	min-height: 50px;
	padding: 0 20px;
	border: 0;
	border-radius: 15px;
	font: inherit;
	font-weight: 800;
	cursor: pointer;
	transition: transform .2s ease, box-shadow .2s ease, background .2s ease;
}

.sip-btn:hover { transform: translateY(-2px); }
.sip-btn--primary { background: var(--sip-brand); color: #fff !important; box-shadow: 0 12px 28px rgba(91,53,245,.28); }
.sip-btn--primary:hover { background: #4c29df; }
.sip-btn--ghost { background: rgba(255,255,255,.75); color: var(--sip-text) !important; border: 1px solid var(--sip-line); }
.sip-btn--light { background: #fff; color: var(--sip-brand) !important; }
.sip-btn--small { min-height: 42px; padding: 0 15px; font-size: 14px; }

.sip-mini-trust { display: flex; flex-wrap: wrap; gap: 10px 18px; color: #50586a; font-size: 13px; font-weight: 650; }
.sip-mini-trust span { display: inline-flex; gap: 7px; align-items: center; }
.sip-mini-trust .sip-icon { width: 17px; height: 17px; color: var(--sip-brand); }

.sip-hero__visual { position: relative; z-index: 1; min-height: 500px; display: grid; place-items: center; }
.sip-phone {
	width: min(330px, 100%);
	border-radius: 34px;
	background: #111522;
	color: #fff;
	padding: 14px;
	box-shadow: 0 34px 80px rgba(18,24,38,.24);
	transform: rotate(2deg);
	position: relative;
}
.sip-phone::before {
	content: "";
	display: block;
	width: 92px;
	height: 18px;
	border-radius: 0 0 14px 14px;
	background: #05070c;
	position: absolute;
	top: 0;
	left: 50%;
	transform: translateX(-50%);
}
.sip-phone__bar { display: flex; justify-content: space-between; align-items: center; padding: 22px 10px 12px; font-size: 12px; }
.sip-phone__bar span { background: rgba(255,255,255,.12); padding: 4px 8px; border-radius: 999px; }
.sip-phone__task { display: flex; gap: 12px; align-items: center; background: #fff; color: var(--sip-text); border-radius: 20px; padding: 17px; }
.sip-phone__task small { display: block; color: #8a91a0; }
.sip-phone__task strong { display: block; font-size: 17px; margin: 2px 0; }
.sip-phone__task p { margin: 0; font-size: 12px; }
.sip-task-icon { width: 44px; height: 44px; display: grid; place-items: center; background: var(--sip-brand-soft); color: var(--sip-brand); border-radius: 14px; }
.sip-phone__status { padding: 18px 10px 6px; }
.sip-phone__status > div { display: flex; gap: 11px; align-items: center; position: relative; min-height: 54px; color: #6e7689; font-size: 13px; }
.sip-phone__status > div:not(:last-child)::after { content: ""; position: absolute; width: 2px; height: 24px; background: #2f3544; left: 15px; bottom: -11px; }
.sip-phone__status i { width: 32px; height: 32px; display: grid; place-items: center; border-radius: 50%; background: #262c3a; }
.sip-phone__status .sip-icon { width: 16px; height: 16px; }
.sip-phone__status .is-done { color: #c8ceda; }
.sip-phone__status .is-done i { background: #1f6f52; color: #fff; }
.sip-phone__status .is-current { color: #fff; font-weight: 800; }
.sip-phone__status .is-current i { background: var(--sip-brand); box-shadow: 0 0 0 7px rgba(122,92,255,.12); }

.sip-phone__pulse {
	position: absolute;
	width: 18px; height: 18px;
	border-radius: 50%;
	background: var(--sip-brand-2);
	right: 28px;
	top: 42%;
	box-shadow: 0 0 0 0 rgba(122,92,255,.45);
	animation: sipPulse 2s infinite;
}
@keyframes sipPulse { 70% { box-shadow: 0 0 0 18px rgba(122,92,255,0); } 100% { box-shadow: 0 0 0 0 rgba(122,92,255,0); } }

.sip-float-card {
	position: absolute;
	display: flex;
	align-items: center;
	gap: 10px;
	background: rgba(255,255,255,.94);
	border: 1px solid #ececf4;
	box-shadow: 0 15px 45px rgba(18,24,38,.13);
	padding: 13px 15px;
	border-radius: 18px;
	min-width: 210px;
	backdrop-filter: blur(10px);
}
.sip-float-card .sip-icon { color: var(--sip-brand); }
.sip-float-card small,
.sip-float-card b { display: block; line-height: 1.25; }
.sip-float-card small { font-size: 10px; text-transform: uppercase; letter-spacing: .08em; color: #8b91a0; }
.sip-float-card b { font-size: 12px; margin-top: 3px; }
.sip-float-card--one { top: 56px; left: -30px; animation: sipFloat 4.2s ease-in-out infinite; }
.sip-float-card--two { right: -34px; bottom: 48px; animation: sipFloat 4.2s .7s ease-in-out infinite; }
@keyframes sipFloat { 50% { transform: translateY(-9px); } }

.sip-section { padding: 110px 16px 20px; scroll-margin-top: 100px; }
.sip-section--soft {
	margin-top: 90px;
	padding: 80px 56px;
	border-radius: var(--sip-radius);
	background: var(--sip-bg);
}
.sip-section-head { max-width: 760px; margin: 0 auto 54px; text-align: center; }
.sip-section-head--left { margin-left: 0; text-align: left; }
.sip-section-head p { font-size: 18px; margin-bottom: 0; }

.sip-stepper {
	display: grid;
	grid-template-columns: 390px minmax(0, 1fr);
	gap: 30px;
	align-items: stretch;
}
.sip-stepper__tabs { display: grid; gap: 8px; }
.sip-step {
	width: 100%;
	display: grid;
	grid-template-columns: 38px 42px 1fr;
	gap: 12px;
	align-items: center;
	text-align: left;
	padding: 13px 14px;
	border: 1px solid transparent;
	background: transparent;
	border-radius: 16px;
	cursor: pointer;
	color: var(--sip-text);
	font: inherit;
	transition: .2s ease;
}
.sip-step:hover { background: #f8f8fc; }
.sip-step.is-active { background: var(--sip-brand-soft); border-color: #dbd4ff; }
.sip-step__num { color: #a0a6b4; font-size: 11px; font-weight: 900; }
.sip-step__icon { width: 42px; height: 42px; display: grid; place-items: center; border: 1px solid var(--sip-line); background: #fff; border-radius: 13px; color: #798092; }
.sip-step.is-active .sip-step__icon { background: var(--sip-brand); color: #fff; border-color: var(--sip-brand); }
.sip-step__icon .sip-icon { width: 19px; height: 19px; }
.sip-step__copy strong,
.sip-step__copy small { display: block; }
.sip-step__copy strong { font-size: 14px; }
.sip-step__copy small { color: #7e8595; font-size: 11px; margin-top: 2px; }

.sip-stepper__stage { position: relative; min-height: 520px; }
.sip-step-panel { height: 100%; animation: sipPanel .26s ease; }
@keyframes sipPanel { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: none; } }
.sip-demo-window {
	height: 100%;
	min-height: 520px;
	border: 1px solid #e9eaf0;
	border-radius: 26px;
	background: linear-gradient(180deg,#fbfbfe,#f0f1f7);
	box-shadow: var(--sip-shadow);
	overflow: hidden;
}
.sip-demo-window__top { height: 54px; display: flex; gap: 7px; align-items: center; padding: 0 18px; border-bottom: 1px solid #e5e7ee; background: rgba(255,255,255,.75); }
.sip-demo-window__top i { width: 9px; height: 9px; border-radius: 50%; background: #d6d9e1; }
.sip-demo-window__top span { margin-left: 8px; color: #9da3b0; font-size: 11px; }
.sip-demo-window__body { display: flex; height: calc(100% - 54px); min-height: 466px; flex-direction: column; justify-content: center; align-items: flex-start; padding: 10%; }
.sip-demo-badge { display: inline-block; padding: 7px 10px; background: #fff; border: 1px solid var(--sip-line); border-radius: 999px; font-size: 11px; font-weight: 800; color: var(--sip-brand); margin-bottom: 20px; }
.sip-demo-window__body h3 { font-size: clamp(28px, 3vw, 44px); max-width: 550px; }
.sip-demo-window__body p { max-width: 560px; font-size: 17px; }
.sip-demo-progress { width: min(500px,100%); height: 8px; border-radius: 999px; background: #dedfea; margin-top: 22px; overflow: hidden; }
.sip-demo-progress span { display: block; height: 100%; border-radius: inherit; background: linear-gradient(90deg,var(--sip-brand),var(--sip-brand-2)); }

.sip-status-demo { max-width: 860px; margin: 0 auto; }
.sip-status-demo__card { background: #fff; border: 1px solid #e4e7ee; border-radius: 26px; padding: 30px; box-shadow: 0 18px 50px rgba(18,24,38,.07); }
.sip-status-demo__top { display: flex; justify-content: space-between; gap: 20px; align-items: center; }
.sip-status-demo__top small,
.sip-status-demo__top strong { display: block; }
.sip-status-demo__top small { color: #9aa0ae; }
.sip-status-demo__top strong { font-size: 20px; margin-top: 3px; }
.sip-status-pill { display: inline-flex; padding: 7px 12px; border-radius: 999px; background: var(--sip-brand-soft); color: var(--sip-brand); font-size: 12px; font-weight: 850; }
.sip-status-track { padding: 50px 0 28px; }
.sip-status-track__line { height: 5px; background: #e3e6ed; border-radius: 999px; overflow: hidden; }
.sip-status-track__line span { display: block; height: 100%; width: 0; background: var(--sip-brand); transition: width .35s ease; }
.sip-status-track__dots { display: flex; justify-content: space-between; margin-top: -10px; }
.sip-status-track__dots i { width: 16px; height: 16px; border-radius: 50%; background: #fff; border: 3px solid #d9dce5; transition: .2s ease; }
.sip-status-track__dots i.is-active { border-color: var(--sip-brand); background: var(--sip-brand); box-shadow: 0 0 0 5px var(--sip-brand-soft); }
.sip-status-desc { min-height: 28px; text-align: center; margin: 0 0 20px; }
.sip-status-controls { display: flex; justify-content: space-between; align-items: center; gap: 12px; border-top: 1px solid var(--sip-line); padding-top: 20px; }
.sip-status-controls > span { color: #8a91a0; font-size: 13px; }

.sip-story-grid { display: grid; grid-template-columns: repeat(5,1fr); gap: 14px; }
.sip-story-grid article { position: relative; padding: 24px 20px; border: 1px solid var(--sip-line); border-radius: 22px; background: #fff; min-height: 270px; }
.sip-story-grid article::after { content: ""; position: absolute; height: 1px; background: #dfe2e9; width: 14px; right: -15px; top: 48px; }
.sip-story-grid article:last-child::after { display: none; }
.sip-story-grid article > span { color: #9aa0ad; font-size: 11px; font-weight: 900; }
.sip-story-grid article > i { width: 44px; height: 44px; display: grid; place-items: center; margin: 15px 0 28px; border-radius: 14px; background: var(--sip-brand-soft); color: var(--sip-brand); }
.sip-story-grid h3 { font-size: 18px; }
.sip-story-grid p { font-size: 13px; margin-bottom: 0; }

.sip-accordion { display: grid; gap: 10px; max-width: 920px; }
.sip-accordion details { border: 1px solid var(--sip-line); border-radius: 18px; background: #fff; overflow: hidden; }
.sip-accordion summary { list-style: none; cursor: pointer; display: flex; justify-content: space-between; gap: 20px; align-items: center; padding: 20px 22px; font-weight: 800; }
.sip-accordion summary::-webkit-details-marker { display: none; }
.sip-accordion summary span { width: 30px; height: 30px; display: grid; place-items: center; border-radius: 50%; background: #f2f3f7; transition: transform .2s ease; }
.sip-accordion details[open] summary span { transform: rotate(45deg); }
.sip-accordion details > div { color: var(--sip-muted); padding: 0 22px 22px; max-width: 800px; }

.sip-cta {
	display: flex;
	justify-content: space-between;
	gap: 30px;
	align-items: center;
	margin-top: 110px;
	padding: 52px 58px;
	border-radius: 30px;
	background: linear-gradient(135deg,#4c29df,#6d4df7);
	color: #fff;
	overflow: hidden;
	position: relative;
}
.sip-cta::after { content: ""; position: absolute; width: 300px; height: 300px; border-radius: 50%; border: 1px solid rgba(255,255,255,.18); right: -120px; top: -140px; box-shadow: 0 0 0 50px rgba(255,255,255,.03), 0 0 0 100px rgba(255,255,255,.02); }
.sip-cta > * { position: relative; z-index: 1; }
.sip-cta .sip-eyebrow { color: #dcd3ff; }
.sip-cta h2 { color: #fff; font-size: clamp(30px,4vw,48px); margin-bottom: 10px; }
.sip-cta p { color: rgba(255,255,255,.78); margin: 0; }

/* Security page */
.sip-hero--security { background: radial-gradient(circle at 88% 15%, rgba(91,53,245,.18), transparent 28%), linear-gradient(145deg,#fff,#f5f7ff); }
.sip-shield-visual { width: 390px; height: 390px; max-width: 90vw; position: relative; display: grid; place-items: center; border-radius: 50%; border: 1px dashed #cfc7ff; }
.sip-shield-visual::before,
.sip-shield-visual::after { content: ""; position: absolute; border-radius: 50%; border: 1px solid rgba(91,53,245,.12); }
.sip-shield-visual::before { inset: 42px; }
.sip-shield-visual::after { inset: 84px; }
.sip-shield-visual__core { width: 160px; height: 160px; border-radius: 44px; display: flex; flex-direction: column; align-items: center; justify-content: center; background: var(--sip-brand); color: #fff; box-shadow: 0 26px 60px rgba(91,53,245,.3); transform: rotate(-4deg); z-index: 2; }
.sip-shield-visual__core .sip-icon { width: 45px; height: 45px; margin-bottom: 10px; }
.sip-shield-visual__core b { font-size: 18px; }
.sip-shield-visual__core small { opacity: .7; font-size: 10px; }
.sip-orbit { position: absolute; display: inline-flex; align-items: center; gap: 6px; background: #fff; border: 1px solid var(--sip-line); border-radius: 999px; padding: 9px 12px; font-size: 11px; font-weight: 800; box-shadow: 0 12px 30px rgba(18,24,38,.09); }
.sip-orbit .sip-icon { width: 16px; height: 16px; color: var(--sip-brand); }
.sip-orbit--1 { top: 6px; left: 110px; }
.sip-orbit--2 { right: -24px; top: 160px; }
.sip-orbit--3 { bottom: 2px; right: 110px; }
.sip-orbit--4 { left: -25px; top: 165px; }

.sip-security-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 16px; }
.sip-security-card { padding: 28px; min-height: 245px; border: 1px solid var(--sip-line); border-radius: 22px; background: #fff; transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease; }
.sip-security-card:hover { transform: translateY(-4px); border-color: #d8d1ff; box-shadow: 0 18px 45px rgba(18,24,38,.07); }
.sip-security-card > i { width: 48px; height: 48px; display: grid; place-items: center; border-radius: 15px; background: var(--sip-brand-soft); color: var(--sip-brand); margin-bottom: 34px; }
.sip-security-card p { font-size: 14px; margin-bottom: 0; }

.sip-verification-flow { display: grid; grid-template-columns: 1fr 30px 1fr 30px 1fr 30px 1fr 30px 1fr; align-items: center; gap: 8px; }
.sip-verification-flow article { min-height: 240px; padding: 22px 18px; border-radius: 20px; background: #fff; border: 1px solid var(--sip-line); }
.sip-verification-flow article > i { width: 42px; height: 42px; display: grid; place-items: center; color: var(--sip-brand); background: var(--sip-brand-soft); border-radius: 13px; }
.sip-verification-flow article > span { display: block; color: #b2b6c1; font-size: 11px; font-weight: 900; margin: 22px 0 5px; }
.sip-verification-flow h3 { font-size: 17px; }
.sip-verification-flow p { font-size: 12px; margin-bottom: 0; }
.sip-flow-arrow { text-align: center; color: #b1b6c2; }

.sip-privacy-map { position: relative; display: grid; grid-template-columns: 1fr 1.25fr 1fr; gap: 90px; align-items: center; min-height: 430px; padding: 50px; border-radius: 28px; background: #f8f8fc; overflow: hidden; }
.sip-privacy-node { position: relative; z-index: 2; display: flex; flex-direction: column; align-items: center; text-align: center; }
.sip-privacy-node > i { width: 80px; height: 80px; display: grid; place-items: center; border-radius: 24px; background: #fff; border: 1px solid var(--sip-line); box-shadow: 0 15px 35px rgba(18,24,38,.07); color: #737b8d; margin-bottom: 14px; }
.sip-privacy-node--system > i { width: 118px; height: 118px; border-radius: 34px; background: var(--sip-brand); color: #fff; box-shadow: 0 20px 55px rgba(91,53,245,.24); }
.sip-privacy-node--system .sip-icon { width: 44px; height: 44px; }
.sip-privacy-node strong { font-size: 18px; }
.sip-privacy-node small { color: #9096a5; }
.sip-privacy-lines { position: absolute; inset: 0; pointer-events: none; }
.sip-line { position: absolute; top: 46%; height: 2px; background: repeating-linear-gradient(90deg,#c7cbd6 0 8px,transparent 8px 16px); width: 30%; }
.sip-line--left { left: 22%; }
.sip-line--right { right: 22%; }
.sip-privacy-notes { position: absolute; bottom: 28px; left: 50%; transform: translateX(-50%); display: flex; gap: 10px; width: calc(100% - 56px); justify-content: center; }
.sip-privacy-notes span { display: inline-flex; align-items: center; gap: 7px; padding: 8px 11px; border-radius: 999px; background: #fff; border: 1px solid var(--sip-line); color: #5e6574; font-size: 11px; }
.sip-privacy-notes .sip-icon { width: 14px; height: 14px; color: var(--sip-brand); }

.sip-section--split { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; }
.sip-payment-safe,
.sip-incident { padding: 34px; border-radius: 26px; border: 1px solid var(--sip-line); }
.sip-do-dont { display: grid; gap: 12px; margin-top: 28px; }
.sip-do-dont article { display: flex; gap: 14px; padding: 18px; border-radius: 18px; }
.sip-do-dont article > i { width: 38px; height: 38px; flex: 0 0 38px; display: grid; place-items: center; border-radius: 12px; font-style: normal; font-size: 24px; }
.sip-do-dont article b { font-size: 10px; text-transform: uppercase; letter-spacing: .1em; }
.sip-do-dont article h3 { font-size: 17px; margin: 4px 0 7px; }
.sip-do-dont article p { margin: 0; font-size: 13px; }
.sip-do-dont .is-do { background: #eef9f4; }
.sip-do-dont .is-do > i { color: var(--sip-good); background: #dff3e9; }
.sip-do-dont .is-do b { color: var(--sip-good); }
.sip-do-dont .is-dont { background: #fff4f4; }
.sip-do-dont .is-dont > i { color: var(--sip-bad); background: #ffe4e4; }
.sip-do-dont .is-dont b { color: var(--sip-bad); }

.sip-incident { background: #111522; border-color: #111522; color: #fff; }
.sip-incident h2 { color: #fff; }
.sip-incident .sip-eyebrow { color: #afa2ff; }
.sip-incident ol { list-style: none; padding: 0; margin: 28px 0 0; display: grid; gap: 20px; }
.sip-incident li { display: flex; gap: 14px; }
.sip-incident li > span { width: 34px; height: 34px; flex: 0 0 34px; display: grid; place-items: center; border-radius: 50%; background: rgba(255,255,255,.09); color: #c6bcff; font-weight: 900; }
.sip-incident li b { font-size: 15px; }
.sip-incident li p { color: #a9afbd; margin: 3px 0 0; font-size: 12px; }

.sip-risk-note { margin-top: 80px; padding: 28px 32px; display: flex; gap: 20px; border: 1px solid #ead8a9; background: #fffaf0; border-radius: 22px; }
.sip-risk-note > i { color: #aa7b12; margin-top: 4px; }
.sip-risk-note h2 { font-size: 22px; margin-bottom: 7px; }
.sip-risk-note p { margin-bottom: 0; font-size: 14px; }

.sip-reveal { opacity: 0; transform: translateY(22px); transition: opacity .7s ease, transform .7s ease; }
.sip-reveal.is-visible { opacity: 1; transform: none; }

@media (max-width: 980px) {
	.sip-hero { grid-template-columns: 1fr; padding: 42px; min-height: auto; }
	.sip-hero__visual { min-height: 470px; }
	.sip-stepper { grid-template-columns: 1fr; }
	.sip-stepper__tabs { grid-template-columns: repeat(7, minmax(170px,1fr)); overflow-x: auto; padding-bottom: 8px; scroll-snap-type: x proximity; }
	.sip-step { scroll-snap-align: start; }
	.sip-story-grid { grid-template-columns: repeat(2,1fr); }
	.sip-story-grid article::after { display: none; }
	.sip-security-grid { grid-template-columns: repeat(2,1fr); }
	.sip-verification-flow { grid-template-columns: repeat(5, minmax(180px,1fr)); overflow-x: auto; gap: 12px; padding-bottom: 10px; }
	.sip-flow-arrow { display: none; }
	.sip-privacy-map { grid-template-columns: 1fr 1fr 1fr; gap: 35px; padding: 40px 24px 100px; }
	.sip-section--split { grid-template-columns: 1fr; }
}

@media (max-width: 680px) {
	.sip-shell { width: min(100% - 20px, 1180px); padding-top: 10px; }
	.sip-shell h1 { font-size: clamp(38px,13vw,58px); }
	.sip-shell h2 { font-size: clamp(30px,10vw,42px); }
	.sip-hero { padding: 30px 22px; border-radius: 26px; }
	.sip-hero__visual { min-height: 410px; }
	.sip-float-card { min-width: auto; max-width: 190px; }
	.sip-float-card--one { left: -3px; top: 24px; }
	.sip-float-card--two { right: -3px; bottom: 20px; }
	.sip-phone { width: 300px; }
	.sip-mini-trust { display: grid; }
	.sip-section { padding: 80px 6px 10px; }
	.sip-section--soft { margin-top: 70px; padding: 60px 20px; }
	.sip-section-head { text-align: left; margin-bottom: 36px; }
	.sip-stepper__tabs { margin-right: -10px; }
	.sip-demo-window,
	.sip-stepper__stage { min-height: 430px; }
	.sip-demo-window__body { min-height: 376px; padding: 32px 24px; }
	.sip-status-demo__card { padding: 20px 16px; }
	.sip-status-demo__top { align-items: flex-start; flex-direction: column; }
	.sip-status-controls { display: grid; grid-template-columns: 1fr 1fr; }
	.sip-status-controls > span { grid-row: 2; grid-column: 1 / -1; text-align: center; }
	.sip-story-grid { grid-template-columns: 1fr; }
	.sip-story-grid article { min-height: 0; }
	.sip-security-grid { grid-template-columns: 1fr; }
	.sip-security-card { min-height: 0; }
	.sip-shield-visual { width: 320px; height: 320px; }
	.sip-orbit--2 { right: -5px; }
	.sip-orbit--4 { left: -5px; }
	.sip-privacy-map { grid-template-columns: 1fr; gap: 24px; padding-bottom: 170px; }
	.sip-privacy-lines { display: none; }
	.sip-privacy-node > i { width: 64px; height: 64px; }
	.sip-privacy-node--system { order: -1; }
	.sip-privacy-node--system > i { width: 90px; height: 90px; }
	.sip-privacy-notes { bottom: 24px; flex-direction: column; width: calc(100% - 32px); }
	.sip-privacy-notes span { border-radius: 14px; }
	.sip-payment-safe,
	.sip-incident { padding: 28px 20px; }
	.sip-risk-note { padding: 22px 18px; }
	.sip-cta { margin-top: 80px; padding: 38px 24px; border-radius: 24px; flex-direction: column; align-items: flex-start; }
}

@media (prefers-reduced-motion: reduce) {
	.sip-shell *,
	.sip-shell *::before,
	.sip-shell *::after {
		scroll-behavior: auto !important;
		animation-duration: .001ms !important;
		animation-iteration-count: 1 !important;
		transition-duration: .001ms !important;
	}
	.sip-reveal { opacity: 1; transform: none; }
}


/* ===== v1.1 mobile interaction + contrast fixes ===== */

/* Neutralize underline rules inherited from the active theme */
.sip-shell a,
.sip-shell a:visited,
.sip-shell a:hover,
.sip-shell a:focus,
.sip-shell a:active {
	text-decoration: none !important;
	text-decoration-line: none !important;
	box-shadow: none;
}

/* Force readable text on dark/purple surfaces even if the theme overrides colors */
.sip-cta,
.sip-cta h1,
.sip-cta h2,
.sip-cta h3,
.sip-cta p,
.sip-cta span,
.sip-cta strong,
.sip-cta small,
.sip-cta .sip-eyebrow,
.sip-incident,
.sip-incident h1,
.sip-incident h2,
.sip-incident h3,
.sip-incident p,
.sip-incident span,
.sip-incident strong,
.sip-incident small,
.sip-shield-visual__core,
.sip-shield-visual__core b,
.sip-shield-visual__core small,
.sip-shield-visual__core span {
	color: #fff !important;
}

.sip-cta p,
.sip-incident p,
.sip-shield-visual__core small {
	color: rgba(255,255,255,.78) !important;
}

.sip-cta .sip-eyebrow,
.sip-incident .sip-eyebrow {
	color: #dcd3ff !important;
}

.sip-cta .sip-btn--light {
	color: var(--sip-brand) !important;
	background: #fff !important;
}

.sip-cta .sip-btn--light span {
	color: var(--sip-brand) !important;
}

/* Mobile step navigation is hidden on larger screens */
.sip-stepper__mobile-nav {
	display: none;
}

@media (max-width: 680px) {
	.sip-shell {
		-webkit-tap-highlight-color: transparent;
	}

	.sip-actions {
		display: grid;
		grid-template-columns: 1fr;
	}

	.sip-actions .sip-btn {
		width: 100%;
		min-height: 54px;
	}

	/* Keep the step tabs touch friendly, but much more compact than desktop */
	.sip-stepper__tabs {
		grid-template-columns: repeat(7, 92px);
		gap: 8px;
		overflow-x: auto;
		scroll-snap-type: x mandatory;
		scrollbar-width: none;
		padding: 2px 2px 10px;
		margin: 0 -4px 8px;
		-webkit-overflow-scrolling: touch;
	}

	.sip-stepper__tabs::-webkit-scrollbar {
		display: none;
	}

	.sip-step {
		grid-template-columns: 1fr;
		gap: 7px;
		justify-items: center;
		text-align: center;
		min-height: 88px;
		padding: 10px 7px;
		scroll-snap-align: center;
		border-color: var(--sip-line);
		background: #fff;
	}

	.sip-step__num {
		display: none;
	}

	.sip-step__icon {
		width: 36px;
		height: 36px;
	}

	.sip-step__copy strong {
		font-size: 11px;
		line-height: 1.2;
	}

	.sip-step__copy small {
		display: none;
	}

	.sip-stepper__stage {
		min-height: 390px;
		touch-action: pan-y;
	}

	.sip-demo-window {
		min-height: 390px;
		border-radius: 22px;
	}

	.sip-demo-window__top {
		height: 46px;
		padding-inline: 14px;
	}

	.sip-demo-window__body {
		min-height: 344px;
		padding: 28px 20px;
	}

	.sip-demo-window__body h3 {
		font-size: 30px;
	}

	.sip-demo-window__body p {
		font-size: 15px;
	}

	/* Persistent thumb-friendly controls under the interactive panel */
	.sip-stepper__mobile-nav {
		display: grid;
		grid-template-columns: 52px minmax(0,1fr) 52px;
		align-items: center;
		gap: 10px;
		position: sticky;
		bottom: 10px;
		z-index: 12;
		margin-top: 12px;
		padding: 10px;
		border: 1px solid rgba(229,232,239,.95);
		border-radius: 18px;
		background: rgba(255,255,255,.94);
		backdrop-filter: blur(12px);
		-webkit-backdrop-filter: blur(12px);
		box-shadow: 0 12px 35px rgba(18,24,38,.12);
	}

	.sip-mobile-step-btn {
		width: 52px;
		height: 52px;
		border: 0;
		border-radius: 15px;
		background: #f1f2f6;
		color: var(--sip-text);
		font-size: 22px;
		font-weight: 800;
		cursor: pointer;
		touch-action: manipulation;
	}

	.sip-mobile-step-btn--primary {
		background: var(--sip-brand);
		color: #fff;
	}

	.sip-mobile-step-btn:disabled {
		opacity: .35;
		cursor: default;
	}

	.sip-mobile-step-meta {
		min-width: 0;
		text-align: center;
		line-height: 1.15;
	}

	.sip-mobile-step-meta small,
	.sip-mobile-step-meta strong {
		display: block;
	}

	.sip-mobile-step-meta small {
		color: #8a91a0;
		font-size: 10px;
		margin-bottom: 4px;
	}

	.sip-mobile-step-meta strong {
		overflow: hidden;
		text-overflow: ellipsis;
		white-space: nowrap;
		font-size: 13px;
		color: var(--sip-text);
	}

	.sip-status-controls .sip-btn {
		min-height: 48px;
		touch-action: manipulation;
	}

	.sip-accordion summary {
		min-height: 62px;
		padding: 18px;
		touch-action: manipulation;
	}

	.sip-security-card {
		padding: 24px 20px;
	}

	.sip-verification-flow {
		scroll-snap-type: x mandatory;
		scrollbar-width: none;
		padding-bottom: 14px;
	}

	.sip-verification-flow::-webkit-scrollbar {
		display: none;
	}

	.sip-verification-flow article {
		scroll-snap-align: center;
	}

	.sip-cta .sip-btn--light {
		width: 100%;
		min-height: 54px;
	}
}


/* =========================================================
   v1.2.0 — true responsive/mobile-first hardening
   ========================================================= */

html:has(.sip-shell),
body.sip-enhanced-page {
	max-width: 100%;
	overflow-x: clip !important;
}

.sip-enhanced-page .entry-content,
.sip-enhanced-page .wp-block-post-content,
.sip-enhanced-page .site-main,
.sip-enhanced-page main {
	max-width: 100% !important;
	overflow-x: clip !important;
}

.sip-shell {
	width: 100% !important;
	max-width: 1180px !important;
	margin-inline: auto !important;
	padding-inline: clamp(10px, 2vw, 24px);
	overflow-x: clip;
}

.sip-shell img,
.sip-shell svg,
.sip-shell video,
.sip-shell iframe {
	max-width: 100%;
}

.sip-shell button,
.sip-shell a {
	-webkit-tap-highlight-color: transparent;
}

@media (max-width: 900px) {
	.sip-shell {
		padding-top: 14px;
	}

	.sip-hero {
		grid-template-columns: 1fr !important;
		gap: 34px !important;
		min-height: 0 !important;
		padding: 38px 28px !important;
	}

	.sip-hero__content {
		max-width: 720px;
	}

	.sip-hero__visual {
		min-height: 420px !important;
		width: 100%;
	}

	.sip-section {
		padding-top: 88px !important;
	}

	.sip-section--soft {
		margin-top: 72px !important;
		padding: 58px 30px !important;
	}

	.sip-stepper {
		grid-template-columns: 1fr !important;
	}

	.sip-story-grid {
		grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
	}

	.sip-security-grid {
		grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
	}

	.sip-section--split {
		grid-template-columns: 1fr !important;
	}

	.sip-privacy-map {
		gap: 36px !important;
	}
}

@media (max-width: 680px) {
	.sip-shell {
		padding-inline: 10px !important;
		padding-bottom: 56px !important;
	}

	.sip-shell h1 {
		font-size: clamp(36px, 11vw, 50px) !important;
		line-height: 1.02 !important;
		letter-spacing: -.045em !important;
	}

	.sip-shell h2 {
		font-size: clamp(28px, 8.5vw, 38px) !important;
		line-height: 1.08 !important;
	}

	.sip-shell h3 {
		font-size: 18px !important;
	}

	.sip-lead,
	.sip-section-head p {
		font-size: 16px !important;
	}

	.sip-hero {
		padding: 28px 18px 24px !important;
		border-radius: 22px !important;
		gap: 24px !important;
	}

	.sip-hero::after {
		width: 220px !important;
		height: 220px !important;
		right: -110px !important;
		top: -100px !important;
	}

	.sip-actions {
		display: grid !important;
		grid-template-columns: 1fr !important;
		gap: 10px !important;
		margin-bottom: 22px !important;
	}

	.sip-actions .sip-btn {
		width: 100% !important;
		min-height: 52px !important;
	}

	.sip-mini-trust {
		display: grid !important;
		grid-template-columns: 1fr !important;
		gap: 8px !important;
	}

	/* Hero mockup: contained, no floating cards escaping viewport */
	.sip-hero__visual {
		min-height: 350px !important;
		display: grid !important;
		place-items: center !important;
	}

	.sip-phone {
		width: min(292px, 92%) !important;
		transform: none !important;
		margin-inline: auto !important;
	}

	.sip-float-card {
		display: none !important;
	}

	.sip-shield-visual {
		width: min(290px, 86vw) !important;
		height: min(290px, 86vw) !important;
	}

	.sip-shield-visual__core {
		width: 132px !important;
		height: 132px !important;
		border-radius: 34px !important;
	}

	.sip-orbit {
		font-size: 10px !important;
		padding: 7px 9px !important;
	}

	.sip-orbit--1 { top: 0 !important; left: 50% !important; transform: translateX(-50%) !important; }
	.sip-orbit--2 { right: -2px !important; top: 46% !important; }
	.sip-orbit--3 { bottom: 0 !important; right: 50% !important; transform: translateX(50%) !important; }
	.sip-orbit--4 { left: -2px !important; top: 46% !important; }

	.sip-section {
		padding: 72px 2px 0 !important;
	}

	.sip-section--soft {
		margin-top: 66px !important;
		padding: 48px 16px !important;
		border-radius: 22px !important;
	}

	.sip-section-head {
		text-align: left !important;
		margin: 0 0 30px !important;
		max-width: none !important;
	}

	/* On phones: hide desktop tab strip; use dedicated mobile controls only */
	.sip-stepper__tabs {
		display: none !important;
	}

	.sip-stepper__stage {
		min-height: 0 !important;
		width: 100% !important;
	}

	.sip-step-panel,
	.sip-demo-window {
		min-height: 0 !important;
		height: auto !important;
	}

	.sip-demo-window {
		border-radius: 20px !important;
		overflow: hidden !important;
	}

	.sip-demo-window__top {
		height: 44px !important;
	}

	.sip-demo-window__body {
		min-height: 330px !important;
		height: auto !important;
		padding: 28px 18px !important;
	}

	.sip-demo-window__body h3 {
		font-size: 28px !important;
	}

	.sip-demo-window__body p {
		font-size: 14px !important;
	}

	.sip-stepper__mobile-nav {
		display: grid !important;
		position: relative !important;
		bottom: auto !important;
		margin-top: 12px !important;
		grid-template-columns: 50px minmax(0, 1fr) 50px !important;
		padding: 8px !important;
		border-radius: 16px !important;
	}

	.sip-mobile-step-btn {
		width: 50px !important;
		height: 50px !important;
	}

	.sip-status-demo__card {
		padding: 18px 14px !important;
		border-radius: 20px !important;
	}

	.sip-status-demo__top {
		flex-direction: column !important;
		align-items: flex-start !important;
	}

	.sip-status-track {
		padding: 34px 0 22px !important;
	}

	.sip-status-controls {
		display: grid !important;
		grid-template-columns: 1fr 1fr !important;
		gap: 8px !important;
	}

	.sip-status-controls .sip-btn {
		width: 100% !important;
		padding-inline: 10px !important;
	}

	.sip-status-controls > span {
		grid-column: 1 / -1 !important;
		grid-row: 2 !important;
		text-align: center !important;
	}

	.sip-story-grid,
	.sip-security-grid {
		grid-template-columns: 1fr !important;
	}

	.sip-story-grid article,
	.sip-security-card {
		min-height: 0 !important;
	}

	/* Security verification becomes a true vertical flow instead of sideways scrolling */
	.sip-verification-flow {
		display: grid !important;
		grid-template-columns: 1fr !important;
		gap: 10px !important;
		overflow: visible !important;
	}

	.sip-verification-flow article {
		min-height: 0 !important;
		padding: 18px !important;
	}

	.sip-flow-arrow {
		display: block !important;
		transform: rotate(90deg);
		justify-self: center;
		line-height: 1;
	}

	/* Privacy map stacks cleanly */
	.sip-privacy-map {
		display: grid !important;
		grid-template-columns: 1fr !important;
		gap: 18px !important;
		min-height: 0 !important;
		padding: 28px 16px !important;
	}

	.sip-privacy-lines {
		display: none !important;
	}

	.sip-privacy-node {
		width: 100% !important;
	}

	.sip-privacy-node--system {
		order: -1 !important;
	}

	.sip-privacy-notes {
		position: static !important;
		transform: none !important;
		width: 100% !important;
		display: grid !important;
		gap: 8px !important;
		margin-top: 10px !important;
	}

	.sip-privacy-notes span {
		border-radius: 14px !important;
		align-items: flex-start !important;
		white-space: normal !important;
	}

	.sip-payment-safe,
	.sip-incident {
		padding: 24px 18px !important;
		border-radius: 22px !important;
	}

	.sip-do-dont article {
		align-items: flex-start !important;
	}

	.sip-risk-note {
		margin-top: 58px !important;
		padding: 20px 16px !important;
		border-radius: 18px !important;
		align-items: flex-start !important;
	}

	.sip-cta {
		margin-top: 70px !important;
		padding: 32px 20px !important;
		border-radius: 22px !important;
		flex-direction: column !important;
		align-items: stretch !important;
	}

	.sip-cta .sip-btn {
		width: 100% !important;
	}

	.sip-accordion summary {
		padding: 17px 16px !important;
		min-height: 58px !important;
	}

	.sip-accordion details > div {
		padding: 0 16px 18px !important;
		font-size: 14px !important;
	}
}

@media (max-width: 420px) {
	.sip-shell {
		padding-inline: 6px !important;
	}

	.sip-hero {
		padding-inline: 15px !important;
	}

	.sip-hero__visual {
		min-height: 320px !important;
	}

	.sip-phone {
		width: 270px !important;
	}

	.sip-phone__task {
		padding: 14px !important;
	}

	.sip-phone__task strong {
		font-size: 15px !important;
	}

	.sip-shield-visual {
		width: 268px !important;
		height: 268px !important;
	}

	.sip-orbit {
		font-size: 9px !important;
	}

	.sip-demo-window__body {
		min-height: 310px !important;
	}

	.sip-stepper__mobile-nav {
		grid-template-columns: 46px minmax(0,1fr) 46px !important;
	}

	.sip-mobile-step-btn {
		width: 46px !important;
		height: 46px !important;
	}

	.sip-mobile-step-meta strong {
		font-size: 12px !important;
	}
}