.tvs21{--n:#173A5E;--b:#4F7FAE;--p:#EAF4FA;--l:#DDE7EE;--m:#687987;color:#263747;max-width:1180px;margin:auto}.tvs21 *{box-sizing:border-box}.tvs21-hero,.tvs21-section,.tvs21-seo{background:#fff;border:1px solid var(--l);border-radius:16px;padding:28px;margin:18px 0}.tvs21-hero{background:linear-gradient(#fff,#F8FBFD)}.tvs21-hero h1{font-size:clamp(32px,5vw,52px)!important;line-height:1.15!important;color:var(--n)!important;border:0!important;background:none!important;padding:0!important}.tvs21-small h1{font-size:clamp(29px,4vw,44px)!important}.tvs21-eye{font-weight:800;color:var(--b);letter-spacing:.06em}.tvs21-section h2,.tvs21-seo h2{background:#fff!important;border-left:6px solid var(--b)!important;border-bottom:3px solid var(--p)!important;color:var(--n)!important;padding:7px 12px!important}.tvs21-main-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:12px}.tvs21-main-grid a{border:1px solid #CCD9E3;border-radius:12px;padding:20px;color:var(--n)!important;text-decoration:none!important}.tvs21-main-grid small,.tvs21-main-grid strong,.tvs21-main-grid span{display:block}.tvs21-main-grid strong{font-size:19px;margin:6px 0}.tvs21-cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:12px}.tvs21-card{border:1px solid var(--l);border-radius:12px;padding:18px}.tvs21-card h3{color:var(--n)}.tvs21-badge{display:inline-block;background:#EEF6ED;border-radius:999px;padding:4px 8px;font-size:12px}.tvs21-checks{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:8px}.tvs21-checks label{border:1px solid var(--l);border-radius:8px;padding:11px}.tvs21-actions{display:flex;gap:8px;flex-wrap:wrap;margin-top:14px}.tvs21-actions button,.tvs21-options button{border:1px solid var(--n);background:#fff;border-radius:8px;padding:11px 13px;cursor:pointer}.tvs21-result{background:#F7FAFC;border-radius:8px;padding:14px;margin-top:14px}.tvs21-progress{height:7px;background:#EDF2F5}.tvs21-progress i{display:block;height:100%;background:var(--b)}.tvs21-options{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:8px}.tvs21-article-cta{border:1px solid var(--l);border-radius:14px;background:#F8FBFD;padding:20px;margin:34px 0}.tvs21-article-cta span{font-size:12px;color:var(--b);font-weight:800}.tvs21-article-cta h3{color:var(--n)}.tvs21-article-cta a{display:inline-block;background:var(--n);color:#fff!important;border-radius:8px;padding:10px 14px;text-decoration:none!important;font-weight:700}@media(max-width:700px){.tvs21-main-grid{grid-template-columns:1fr}.tvs21-hero,.tvs21-section,.tvs21-seo{padding:18px;border-radius:12px}}
.tvs21-cross{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin:18px 0;padding:14px 16px;border:1px solid var(--l);border-radius:12px;background:#fff}
.tvs21-cross span{font-size:12px;color:#687987;font-weight:700}
.tvs21-cross a{font-size:13px;color:var(--n)!important;text-decoration:none!important;border:1px solid #DCE7EF;border-radius:999px;padding:6px 9px}
.tvs21-cross a:hover{border-color:var(--b);background:#F8FBFD}

.tvs21 a:focus-visible,.tvs21 button:focus-visible{outline:3px solid #9FC5E8;outline-offset:2px}
.tvs21 button{font:inherit}
.tvs21-card a,.tvs21-article-cta a{min-height:44px;display:inline-flex;align-items:center}
@media(max-width:700px){
  .tvs21-actions button,.tvs21-options button{min-height:46px}
  .tvs21-card a,.tvs21-article-cta a{width:100%;justify-content:center}
}

.tvs21-result p{margin:.45em 0 10px}
.tvs21-result-links{display:flex;gap:8px;flex-wrap:wrap}
.tvs21-result-links a{display:inline-flex;align-items:center;min-height:42px;padding:8px 11px;border:1px solid #BFD1DE;border-radius:8px;background:#fff;color:#173A5E!important;text-decoration:none!important;font-weight:700}
.tvs21-result-links a:hover{border-color:#4F7FAE;background:#F8FBFD}
@media(max-width:700px){.tvs21-result-links{display:grid}.tvs21-result-links a{width:100%}}

/* Homepage service gateway */
.tvs21-home-gateway{
	max-width:1180px;
	margin:22px auto 30px;
	padding:26px;
	border:1px solid #DDE7EE;
	border-radius:16px;
	background:linear-gradient(180deg,#F8FBFD 0%,#FFFFFF 100%);
}
.tvs21-home-gateway-head{max-width:780px;margin-bottom:18px}
.tvs21-home-gateway-head h2{
	margin:.25em 0!important;
	padding:0!important;
	border:0!important;
	background:none!important;
	color:#173A5E!important;
	font-size:clamp(26px,3.4vw,38px)!important;
	line-height:1.25!important;
}
.tvs21-home-gateway-head p{line-height:1.8}
.tvs21-home-gateway-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.tvs21-home-gateway-card{
	display:block;
	min-height:132px;
	padding:18px;
	border:1px solid #CCD9E3;
	border-radius:12px;
	background:#fff;
	color:#173A5E!important;
	text-decoration:none!important;
	transition:.15s ease;
}
.tvs21-home-gateway-card:hover{border-color:#4F7FAE;box-shadow:0 7px 20px rgba(23,58,94,.07);transform:translateY(-1px)}
.tvs21-home-gateway-card span,.tvs21-home-gateway-card strong,.tvs21-home-gateway-card small{display:block}
.tvs21-home-gateway-card span{font-size:12px;font-weight:800;color:#4F7FAE}
.tvs21-home-gateway-card strong{font-size:19px;margin:6px 0;color:#173A5E}
.tvs21-home-gateway-card small{font-size:13px;line-height:1.6;color:#687987}
.tvs21-home-gateway-meal{grid-column:1/-1}
.tvs21-home-gateway-all{text-align:center;margin-top:16px}
.tvs21-home-gateway-all a{
	display:inline-flex;
	align-items:center;
	justify-content:center;
	min-height:44px;
	padding:9px 16px;
	border:1px solid #173A5E;
	border-radius:8px;
	color:#173A5E!important;
	text-decoration:none!important;
	font-weight:700;
}

/* Cocoon header service menu */
#navi .toviel-select-header-menu > a{font-weight:700}
#navi .toviel-select-header-menu .sub-menu{min-width:180px}
#navi .toviel-select-header-menu .sub-menu a{white-space:nowrap}

/* Mobile drawer */
.menu-drawer .toviel-select-header-menu .sub-menu{display:block!important}
.menu-drawer .toviel-select-header-menu .sub-menu a{padding-left:1.6em}

@media(max-width:700px){
	.tvs21-home-gateway{padding:18px;margin:14px auto 22px;border-radius:12px}
	.tvs21-home-gateway-grid{grid-template-columns:1fr}
	.tvs21-home-gateway-meal{grid-column:auto}
	.tvs21-home-gateway-card{min-height:0}
}

/* =========================================================
   TOVIEL v3.2 — service-site UX integration
   ========================================================= */

/* Home: integrated quick-start */
.tvs32-start{
	max-width:1180px;
	margin:-34px auto 34px;
	padding:0 18px;
	position:relative;
	z-index:5;
}
.tvs32-start-inner{
	background:#fff;
	border:1px solid #D8E3EB;
	border-radius:16px;
	box-shadow:0 14px 38px rgba(23,58,94,.08);
	overflow:hidden;
}
.tvs32-start-copy{
	display:flex;
	align-items:flex-end;
	justify-content:space-between;
	gap:24px;
	padding:22px 24px 18px;
	border-bottom:1px solid #E7EEF3;
}
.tvs32-start-copy > div{min-width:0}
.tvs32-kicker{
	margin:0 0 5px!important;
	color:#4F7FAE;
	font-size:11px;
	font-weight:800;
	letter-spacing:.09em;
}
.tvs32-start-copy h2{
	margin:0!important;
	padding:0!important;
	border:0!important;
	background:none!important;
	color:#173A5E!important;
	font-size:clamp(23px,2.8vw,34px)!important;
	line-height:1.25!important;
}
.tvs32-start-copy > p:last-child{
	max-width:430px;
	margin:0!important;
	color:#637584;
	font-size:13px;
	line-height:1.75;
}
.tvs32-start-grid{
	display:grid;
	grid-template-columns:repeat(5,minmax(0,1fr));
}
.tvs32-start-item{
	position:relative;
	display:flex;
	flex-direction:column;
	min-height:150px;
	padding:18px 17px 16px;
	border-right:1px solid #E7EEF3;
	color:#173A5E!important;
	text-decoration:none!important;
	background:#fff;
	transition:.16s ease;
}
.tvs32-start-item:last-child{border-right:0}
.tvs32-start-item:hover{
	background:#F8FBFD;
	transform:translateY(-1px);
}
.tvs32-start-num{
	position:absolute;
	top:13px;
	right:14px;
	font-size:11px;
	color:#A7B7C3;
	font-weight:700;
}
.tvs32-start-meta{
	font-size:10px;
	color:#4F7FAE;
	font-weight:800;
	letter-spacing:.05em;
}
.tvs32-start-item strong{
	display:block;
	margin:18px 0 7px;
	font-size:18px;
	color:#173A5E;
}
.tvs32-start-item small{
	display:block;
	color:#687987;
	font-size:12px;
	line-height:1.65;
}
.tvs32-start-item i{
	margin-top:auto;
	padding-top:12px;
	color:#4F7FAE;
	font-style:normal;
	font-size:17px;
}
.tvs32-trust{
	display:flex;
	align-items:center;
	gap:8px 18px;
	flex-wrap:wrap;
	padding:12px 18px;
	background:#F8FBFD;
	border-top:1px solid #E7EEF3;
}
.tvs32-trust span{
	position:relative;
	padding-left:13px;
	color:#687987;
	font-size:11px;
}
.tvs32-trust span:before{
	content:'';
	position:absolute;
	left:0;
	top:.52em;
	width:5px;height:5px;
	border-radius:50%;
	background:#7FA7C8;
}
.tvs32-trust a{
	margin-left:auto;
	color:#173A5E!important;
	font-size:12px;
	font-weight:800;
	text-decoration:none!important;
}

/* Hero: primary service action */
.tvs32-hero-primary{
	background:#173A5E!important;
	color:#fff!important;
	border-color:#173A5E!important;
}

/* Header: lightweight service entry */
#navi .toviel-select-header-menu > a{
	position:relative;
	font-weight:800!important;
}
#navi .toviel-select-header-menu > a:after{
	content:'';
	position:absolute;
	left:18%;
	right:18%;
	bottom:8px;
	height:2px;
	background:#7FA7C8;
	border-radius:2px;
}

/* Service pages: remove "article card stack" feel */
body.toviel-v3-service .toc,
body.toviel-v3-service .toc-widget-box,
body.toviel-v3-service .toc-content{
	display:none!important;
}
body.toviel-v3-service .tvs21{
	max-width:1080px;
}
body.toviel-v3-service .tvs21-hero{
	margin:0 0 34px!important;
	padding:42px 32px 38px!important;
	border:0!important;
	border-bottom:1px solid #DDE7EE!important;
	border-radius:0!important;
	background:linear-gradient(180deg,#FFFFFF 0%,#F8FBFD 100%)!important;
}
body.toviel-v3-service .tvs21-section,
body.toviel-v3-service .tvs21-seo{
	margin:0!important;
	padding:34px 26px!important;
	border:0!important;
	border-bottom:1px solid #E5EDF2!important;
	border-radius:0!important;
	background:#fff!important;
}
body.toviel-v3-service .tvs21-section:nth-of-type(2){
	margin:0 0 8px!important;
	padding:28px!important;
	border:1px solid #DCE7EF!important;
	border-radius:14px!important;
	background:#F8FBFD!important;
}
body.toviel-v3-service .tvs21-section h2,
body.toviel-v3-service .tvs21-seo h2{
	margin:0 0 20px!important;
	padding:0 0 10px!important;
	border-left:0!important;
	border-bottom:1px solid #D9E6EF!important;
	background:none!important;
	font-size:23px!important;
}
body.toviel-v3-service .tvs21-card{
	border:1px solid #DFE8EE;
	border-radius:12px;
	background:#fff;
	box-shadow:none;
}
body.toviel-v3-service .tvs21-card:hover{
	border-color:#9FB9CC;
}
body.toviel-v3-service .tvs21-checks label{
	background:#fff;
	border:1px solid #D4E0E8;
	transition:.12s ease;
	cursor:pointer;
}
body.toviel-v3-service .tvs21-checks label:has(input:checked){
	border-color:#4F7FAE;
	background:#F2F7FB;
	box-shadow:inset 0 0 0 1px #4F7FAE;
}
body.toviel-v3-service .tvs21-actions button,
body.toviel-v3-service .tvs21-options button{
	min-height:44px;
	border:1px solid #AFC3D1;
	background:#fff;
	color:#173A5E;
	font-weight:700;
	transition:.12s ease;
}
body.toviel-v3-service .tvs21-actions button:hover,
body.toviel-v3-service .tvs21-options button:hover,
body.toviel-v3-service .tvs21-actions button.is-active,
body.toviel-v3-service .tvs21-options button.is-active{
	background:#173A5E;
	border-color:#173A5E;
	color:#fff;
}
body.toviel-v3-service .tvs21-result{
	margin-top:16px;
	padding:18px;
	border:1px solid #DCE7EF;
	background:#fff;
}
body.toviel-v3-service .tvs21-cross{
	margin:28px 0 0!important;
	padding:18px 0!important;
	border:0!important;
	border-top:1px solid #DDE7EE!important;
	border-radius:0!important;
	background:#fff!important;
}

/* Keep current article/theme sections visually secondary to the service entry */
body.home .tvs32-start + section,
body.home .tvs32-start ~ section{
	scroll-margin-top:90px;
}

@media(max-width:1000px){
	.tvs32-start-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
	.tvs32-start-item{border-bottom:1px solid #E7EEF3}
	.tvs32-start-item:nth-child(even){border-right:0}
	.tvs32-start-item:last-child{grid-column:1/-1;border-bottom:0}
}
@media(max-width:700px){
	.tvs32-start{
		margin:-16px auto 24px;
		padding:0 12px;
	}
	.tvs32-start-inner{border-radius:13px}
	.tvs32-start-copy{
		display:block;
		padding:18px 17px 15px;
	}
	.tvs32-start-copy > p:last-child{margin-top:8px!important}
	.tvs32-start-grid{grid-template-columns:1fr}
	.tvs32-start-item{
		min-height:0;
		padding:15px 16px;
		border-right:0;
		border-bottom:1px solid #E7EEF3;
	}
	.tvs32-start-item:last-child{grid-column:auto}
	.tvs32-start-item strong{margin:5px 0 4px}
	.tvs32-start-item i{
		position:absolute;
		right:16px;
		top:38%;
		margin:0;padding:0;
	}
	.tvs32-trust{display:grid;padding:13px 16px}
	.tvs32-trust a{margin-left:0;margin-top:3px}
	body.toviel-v3-service .tvs21-hero{padding:28px 18px 25px!important}
	body.toviel-v3-service .tvs21-section,
	body.toviel-v3-service .tvs21-seo{padding:26px 17px!important}
	body.toviel-v3-service .tvs21-section:nth-of-type(2){padding:19px!important}
}

/* =========================================================
   TOVIEL v3.2.1 — final visual polish
   ========================================================= */

.tvs32-start{
	max-width:1180px;
	margin:-28px auto 42px;
}
.tvs32-start-inner{
	border-color:#D5E1E9;
	border-radius:18px;
	box-shadow:0 18px 44px rgba(23,58,94,.075);
}

.tvs32-start-copy{
	display:grid;
	grid-template-columns:minmax(360px,1.15fr) minmax(280px,.85fr);
	align-items:end;
	gap:42px;
	padding:26px 28px 22px;
}
.tvs32-kicker{
	margin:0 0 8px!important;
	font-size:10px;
	letter-spacing:.14em;
	color:#6D92AF;
}
.tvs32-start-copy h2{
	font-size:clamp(25px,2.7vw,36px)!important;
	letter-spacing:-.02em;
}
.tvs32-nowrap{white-space:nowrap}
.tvs32-start-copy > p:last-child{
	max-width:none;
	font-size:13px;
	line-height:1.85;
	color:#657887;
}

.tvs32-start-grid{
	grid-template-columns:repeat(3,minmax(0,1fr)) repeat(2,minmax(0,.88fr));
}
.tvs32-start-item{
	min-height:164px;
	padding:20px 18px 18px;
}
.tvs32-start-item.is-primary{
	background:#fff;
}
.tvs32-start-item.is-primary strong{
	font-size:19px;
}
.tvs32-start-item.is-secondary{
	background:#FBFCFD;
}
.tvs32-start-item.is-secondary strong{
	font-size:17px;
}
.tvs32-start-item:hover{
	background:#F4F8FB;
	box-shadow:inset 0 3px 0 #6E9ABC;
	transform:none;
}
.tvs32-start-item strong{
	margin:20px 0 8px;
	letter-spacing:-.01em;
}
.tvs32-start-item small{
	font-size:11.5px;
	line-height:1.72;
}
.tvs32-start-item i{
	font-size:18px;
	transition:transform .14s ease;
}
.tvs32-start-item:hover i{transform:translateX(3px)}

.tvs32-trust{
	padding:13px 20px;
	gap:10px 20px;
}
.tvs32-trust a{
	padding-left:14px;
	border-left:1px solid #D9E4EB;
}

/* Make the Hero + Quick Start read as one experience */
body.home .tvs32-start{
	position:relative;
}
body.home .tvs32-start:before{
	content:'';
	position:absolute;
	top:-28px;
	left:50%;
	width:1px;
	height:28px;
	background:#D8E4EC;
}

/* Reduce visual noise in later homepage modules */
body.home .tvs32-start ~ section{
	position:relative;
}
body.home .tvs32-start ~ section h2{
	letter-spacing:-.01em;
}

/* Service pages: calmer editorial/tool mix */
body.toviel-v3-service .tvs21-hero{
	padding-top:46px!important;
	padding-bottom:42px!important;
}
body.toviel-v3-service .tvs21-hero h1{
	max-width:820px;
	letter-spacing:-.025em;
}
body.toviel-v3-service .tvs21-section:nth-of-type(2){
	box-shadow:0 8px 24px rgba(23,58,94,.045);
}
body.toviel-v3-service .tvs21-result{
	border-left:4px solid #7EA3BF;
	padding-left:20px;
}
body.toviel-v3-service .tvs21-result-links a{
	background:#fff;
}
body.toviel-v3-service .tvs21-result-links a:hover{
	background:#F5F9FC;
}

/* Header link should feel native, not bolted on */
#navi .toviel-select-header-menu > a{
	color:#173A5E!important;
}
#navi .toviel-select-header-menu > a:after{
	left:22%;
	right:22%;
	bottom:6px;
	height:1px;
}

/* Tablet */
@media(max-width:1050px){
	.tvs32-start-copy{
		grid-template-columns:1fr;
		gap:10px;
	}
	.tvs32-start-grid{
		grid-template-columns:repeat(2,minmax(0,1fr));
	}
	.tvs32-start-item:nth-child(5){
		grid-column:1/-1;
	}
}

/* Mobile */
@media(max-width:700px){
	.tvs32-start{
		margin:-10px auto 28px;
	}
	.tvs32-start:before{display:none}
	.tvs32-start-copy{
		display:block;
		padding:20px 17px 16px;
	}
	.tvs32-start-copy h2{
		font-size:25px!important;
	}
	.tvs32-nowrap{white-space:normal}
	.tvs32-start-grid{
		grid-template-columns:1fr;
	}
	.tvs32-start-item:nth-child(5){
		grid-column:auto;
	}
	.tvs32-start-item{
		min-height:0;
		padding:15px 16px 14px;
	}
	.tvs32-start-item strong{
		margin:5px 0 4px;
		font-size:17px!important;
	}
	.tvs32-start-item small{
		padding-right:24px;
	}
	.tvs32-trust a{
		padding-left:0;
		border-left:0;
		border-top:1px solid #D9E4EB;
		padding-top:10px;
	}
}

/* =========================================================
   TOVIEL v3.2.2 — final freeze QA polish
   ========================================================= */

/* Avoid awkward half-window/tablet wrapping */
@media(max-width:860px){
	.tvs32-start-copy{
		grid-template-columns:1fr;
		gap:10px;
	}
	.tvs32-start-copy > p:last-child{
		max-width:680px;
	}
	.tvs32-start-grid{
		grid-template-columns:repeat(2,minmax(0,1fr));
	}
	.tvs32-start-item:nth-child(5){
		grid-column:1/-1;
	}
}

/* Give service cards a slightly stronger hierarchy without becoming flashy */
.tvs32-start-item.is-primary{
	box-shadow:inset 0 2px 0 rgba(79,127,174,.22);
}
.tvs32-start-item.is-secondary{
	box-shadow:inset 0 2px 0 rgba(140,160,174,.11);
}

/* Keep first-view typography stable */
@media(min-width:861px){
	.tvs32-start-copy h2{
		max-width:560px;
	}
}

/* Accessible control feedback */
body.toviel-v3-service .tvs21-actions button[aria-pressed="true"],
body.toviel-v3-service .tvs21-options button[aria-pressed="true"]{
	background:#173A5E;
	border-color:#173A5E;
	color:#fff;
}
body.toviel-v3-service button:focus-visible,
.tvs32-start a:focus-visible,
#navi .toviel-select-header-menu > a:focus-visible{
	outline:3px solid #8CB6D7!important;
	outline-offset:3px!important;
}

/* Result area should read like the next action, not a generic text box */
body.toviel-v3-service .tvs21-result:not(:empty){
	position:relative;
	padding:20px 20px 20px 22px;
	border:1px solid #D7E4EC;
	border-left:4px solid #5E8FB5;
	border-radius:10px;
	background:linear-gradient(90deg,#F8FBFD 0%,#FFFFFF 75%);
}
body.toviel-v3-service .tvs21-result:not(:empty) strong{
	display:block;
	color:#173A5E;
	font-size:16px;
	line-height:1.6;
}

/* Slightly tighter visual continuation from hero */
body.home .tvs32-start{
	margin-top:-24px;
}

/* Prevent long Japanese/English labels from ugly narrow wrapping */
.tvs32-start-meta{
	overflow-wrap:normal;
	word-break:keep-all;
}
.tvs32-start-item strong{
	word-break:keep-all;
}

/* Full mobile reset */
@media(max-width:700px){
	.tvs32-start-copy h2{
		max-width:none;
	}
	.tvs32-start-grid{
		grid-template-columns:1fr;
	}
	.tvs32-start-item:nth-child(5){
		grid-column:auto;
	}
	body.home .tvs32-start{
		margin-top:-8px;
	}
}
