/* Piqelo buying-guide and decision-cluster containment v830. */
html{
  max-width:100%;
  overflow-x:clip;
}
body{
  max-width:100%;
}
.wrap,
main,
.hero,
.hero > *,
.section,
.card,
.panel,
.ranklist,
.rankcard,
.grid2,
.watch,
.bestHero,
.bestHero > *,
.guideGroups,
.guideGroup,
.guideCards,
.guideCard,
.methodBand,
.finderBand,
.seoDecision,
.seoContent,
.seoQuickGrid,
.seoQuickCard,
.seoScenarioGrid,
.seoScenario,
.seoClusterLinks,
.seoClusterLinks > *,
.seoArticleHero,
.seoArticleHero > *,
.seoTableWrap{
  box-sizing:border-box;
  min-width:0;
  max-width:100%;
}
img,
svg,
video{
  max-width:100%;
}
.seoDecision{
  margin:20px 0 8px;
  padding:24px;
  border:1px solid rgba(99,217,242,.24);
  border-radius:24px;
  background:linear-gradient(145deg,rgba(9,35,53,.96),rgba(7,27,43,.94));
  box-shadow:0 20px 52px rgba(0,10,22,.2);
  overflow:hidden;
}
.seoDecision h2,
.seoContent h2{margin:6px 0 10px}
.seoDecision h3,
.seoContent h3{margin:0 0 7px}
.seoDecision p,
.seoContent p{color:#a9bfca}
.seoDecision .seoLead{font-size:17px;color:#d9eaf1;max-width:850px}
.seoQuickGrid{
  display:grid;
  grid-template-columns:repeat(5,minmax(0,1fr));
  gap:10px;
  margin-top:18px;
}
.seoQuickCard{
  display:flex;
  flex-direction:column;
  gap:5px;
  min-height:140px;
  padding:15px;
  border:1px solid rgba(116,190,214,.21);
  border-radius:16px;
  background:rgba(8,29,45,.74);
  text-decoration:none;
  overflow:hidden;
}
.seoQuickCard:hover{border-color:rgba(91,231,207,.55);transform:translateY(-1px)}
.seoQuickCard small,
.seoKicker{font-size:10px;font-weight:900;letter-spacing:.11em;text-transform:uppercase;color:#65dfc5}
.seoQuickCard b{font-size:15px;color:#eff9fd}
.seoQuickCard span{font-size:12px;color:#91acb9}
.seoTableWrap{
  width:100%;
  margin:16px 0;
  overflow-x:auto;
  overscroll-behavior-inline:contain;
  -webkit-overflow-scrolling:touch;
}
.seoTable{width:100%;min-width:720px;border-collapse:collapse;background:rgba(6,26,41,.72);border-radius:16px;overflow:hidden}
.seoTable th,
.seoTable td{padding:13px 12px;border-bottom:1px solid rgba(115,184,207,.16);text-align:left;vertical-align:top}
.seoTable th{font-size:10px;letter-spacing:.08em;text-transform:uppercase;color:#73dac8;background:rgba(9,45,62,.72)}
.seoTable td{font-size:13px;color:#bdd0d8}
.seoTable td:first-child{font-weight:850;color:#f1f8fb}
.seoTable a{color:#7be7d0;text-decoration:none}
.seoTable tr:last-child td{border-bottom:0}
.seoContent{max-width:950px;margin:0 auto;padding:22px 0}
.seoContent section{padding:22px 0;border-bottom:1px solid rgba(116,190,214,.14)}
.seoContent section:last-child{border-bottom:0}
.seoContent ul{color:#a9bfca;padding-left:20px}
.seoContent li{margin:8px 0}
.seoContent strong{color:#edf8fc}
.seoContent a:not(.btn){color:#72dfc7}
.seoNote{padding:15px 17px;border:1px solid rgba(116,190,214,.22);border-radius:15px;background:rgba(9,39,56,.72);color:#b7cbd4!important}
.seoUpdated{display:flex;gap:8px;flex-wrap:wrap;margin-top:16px;font-size:11px;color:#88a5b3}
.seoUpdated span{padding:6px 9px;border:1px solid rgba(116,190,214,.2);border-radius:999px;background:rgba(6,29,44,.7)}
.seoScenarioGrid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin:16px 0}
.seoScenario{padding:16px;border:1px solid rgba(116,190,214,.2);border-radius:17px;background:rgba(8,31,47,.72)}
.seoScenario b{display:block;margin-bottom:5px}
.seoScenario p{font-size:13px;margin:0}
.seoVerdict{padding:22px;border-radius:20px;border:1px solid rgba(103,228,197,.3);background:linear-gradient(135deg,rgba(14,78,78,.38),rgba(9,38,58,.8))}
.seoVerdict h2{font-size:25px}
.seoVerdict p{font-size:16px;color:#d8e9ef}
.seoClusterLinks{
  display:grid;
  grid-template-columns:repeat(5,minmax(0,1fr));
  gap:10px;
  margin-top:15px;
}
.seoClusterLinks a{
  display:flex;
  width:100%;
  min-width:0;
  flex-direction:column;
  padding:14px;
  border:1px solid rgba(116,190,214,.2);
  border-radius:15px;
  background:rgba(8,31,47,.72);
  text-decoration:none;
  overflow:hidden;
}
.seoClusterLinks b{display:block;font-size:14px;color:#edf8fb;overflow-wrap:anywhere}
.seoClusterLinks span{display:block;margin-top:4px;font-size:11px;color:#8faab7;overflow-wrap:anywhere}
.seoArticleHero{padding:32px 0 16px}
.seoArticleHero .card{padding:30px;background:radial-gradient(circle at 88% 10%,rgba(75,219,201,.14),transparent 32%),linear-gradient(135deg,#09283b,#071d2e)}
.seoArticleHero h1{max-width:900px}
.seoArticleHero .lead{max-width:820px}
.seoFaq details{padding:14px 0;border-bottom:1px solid rgba(116,190,214,.16)}
.seoFaq summary{cursor:pointer;font-weight:850;color:#e9f5fa}
.seoFaq p{margin:8px 0 0}
.seoMethod{font-size:12px;color:#8fa9b7}
.seoMethod a{font-weight:800}
.rankcard > *,
.winnerMini > *,
.guideCard > *,
.sectionIntro > *{min-width:0}
.rankcard h3,
.rankmeta,
.guideCard b,
.guideCard span,
.winnerCopy b,
.winnerCopy p,
.guideExplanationIntro,
.guideSourceBack{overflow-wrap:anywhere}
@media(max-width:980px){
  .seoQuickGrid,
  .seoClusterLinks{grid-template-columns:repeat(2,minmax(0,1fr))}
  .seoScenarioGrid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:700px){
  .hero,
  .grid2,
  .watch,
  .bestHero,
  .guideGroups,
  .methodBand{grid-template-columns:minmax(0,1fr)!important}
  .seoDecision{margin:16px 0 8px;padding:18px 16px;border-radius:20px}
  .seoDecision .seoLead{font-size:15px;line-height:1.55}
  .seoQuickGrid,
  .seoClusterLinks,
  .seoScenarioGrid{grid-template-columns:minmax(0,1fr)}
  .seoQuickCard{min-height:auto}
  .seoClusterLinks{gap:10px}
  .seoClusterLinks a{min-height:auto;padding:15px 16px;border-radius:16px}
  .seoClusterLinks b{font-size:15px;line-height:1.3}
  .seoClusterLinks span{font-size:12px;line-height:1.45}
  .seoArticleHero .card{padding:21px 18px}
  .seoArticleHero h1{font-size:clamp(32px,10.5vw,48px);overflow-wrap:break-word}
  .seoTable{min-width:640px}
  .seoTable th,
  .seoTable td{padding:11px 10px}
  .guideSourceBack{width:100%;max-width:100%}
}
@media(max-width:380px){
  .seoDecision{padding:16px 14px}
  .seoClusterLinks a{padding:14px}
  .seoArticleHero .card{padding:18px 15px}
}
@supports not (overflow:clip){
  html{overflow-x:hidden}
}
