/*
 * Smartphoneshop.dk category content system
 * V2 content is semantic HTML; presentation lives here.
 * Legacy selectors below keep existing category content compatible while categories migrate gradually.
 */

.ss-category-v2,
.ss-category-v2 * { box-sizing: border-box; }

.ss-category-v2 {
  --ss-cat-teal: #00adb5;
  --ss-cat-teal-dark: #007f86;
  --ss-cat-yellow: #fed766;
  --ss-cat-dark: #11181c;
  --ss-cat-copy: #34474d;
  --ss-cat-muted: #65757b;
  --ss-cat-border: #d7e5e7;
  --ss-cat-soft: #f3fbfb;
  color: var(--ss-cat-dark);
  text-align: left;
}

.ss-category-v2 h2,
.ss-category-v2 h3,
.ss-category-v2 p { text-align: left; }

.ss-category-v2 h2 {
  margin: 0 0 10px;
  color: var(--ss-cat-dark);
  font-size: clamp(1.55rem, 2.6vw, 2.15rem);
  line-height: 1.12;
  font-weight: 800;
}

.ss-category-v2 h3 {
  margin: 0 0 7px;
  color: var(--ss-cat-dark);
  font-size: 1.02rem;
  line-height: 1.25;
  font-weight: 800;
}

.ss-category-v2 p {
  margin: 0;
  color: var(--ss-cat-copy);
  font-size: 1rem;
  line-height: 1.6;
}

.ss-category-v2__eyebrow {
  margin: 0 0 8px !important;
  color: var(--ss-cat-teal-dark) !important;
  font-size: .76rem !important;
  line-height: 1.2 !important;
  font-weight: 900;
  letter-spacing: .075em;
  text-transform: uppercase;
}

.ss-category-v2__lead {
  max-width: 760px;
  font-size: 1.06rem !important;
  line-height: 1.62 !important;
}

.ss-category-v2--top {
  margin: 0 0 18px;
  padding: 24px 26px;
  border: 1px solid var(--ss-cat-border);
  border-radius: 20px;
  background:
    radial-gradient(circle at 95% 0, rgba(254,215,102,.24), transparent 26%),
    linear-gradient(135deg, #f0fbfb 0%, #fff 68%);
}

.ss-category-v2__top-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.55fr) minmax(240px, .65fr);
  gap: 28px;
  align-items: center;
}

.ss-category-v2__microcopy {
  margin-top: 10px !important;
  color: var(--ss-cat-muted) !important;
  font-size: .88rem !important;
  line-height: 1.45 !important;
}

.ss-category-v2__guide-card {
  padding: 16px 17px;
  border: 1px solid #eadba8;
  border-radius: 15px;
  background: rgba(255,250,232,.92);
}

.ss-category-v2__guide-label {
  display: block;
  margin-bottom: 5px;
  color: #7d6512;
  font-size: .72rem;
  font-weight: 900;
  letter-spacing: .06em;
  text-transform: uppercase;
}

.ss-category-v2__guide-card strong {
  display: block;
  margin-bottom: 6px;
  color: var(--ss-cat-dark);
  font-size: 1rem;
  line-height: 1.3;
}

.ss-category-v2__guide-card p {
  margin-bottom: 12px;
  font-size: .88rem;
  line-height: 1.48;
}

.ss-category-v2__button {
  display: inline-flex;
  min-height: 40px;
  align-items: center;
  justify-content: center;
  padding: 9px 15px;
  border: 1px solid var(--ss-cat-teal);
  border-radius: 10px;
  background: var(--ss-cat-teal);
  color: #fff !important;
  font-size: .86rem;
  font-weight: 800;
  text-decoration: none !important;
}

.ss-category-v2__button:hover {
  border-color: var(--ss-cat-teal-dark);
  background: var(--ss-cat-teal-dark);
  color: #fff !important;
}

.ss-category-v2--bottom {
  display: grid;
  gap: 16px;
  margin: 26px 0 0;
}

.ss-category-v2__section {
  padding: 24px;
  border: 1px solid var(--ss-cat-border);
  border-radius: 18px;
  background: #fff;
}

.ss-category-v2__section--intro {
  background: linear-gradient(135deg, #f2fbfb 0%, #fff 72%);
}

.ss-category-v2__section--why {
  background: #fffaf0;
  border-color: #eedfae;
}

.ss-category-v2__section-head {
  margin-bottom: 15px;
}

.ss-category-v2__decision-grid,
.ss-category-v2__value-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
  margin-top: 18px;
}

.ss-category-v2__decision-card,
.ss-category-v2__value-card {
  min-width: 0;
  padding: 16px;
  border: 1px solid var(--ss-cat-border);
  border-radius: 14px;
  background: #fff;
}

.ss-category-v2__decision-card > span:first-child {
  display: inline-flex;
  margin-bottom: 13px;
  color: var(--ss-cat-teal-dark);
  font-size: .78rem;
  font-weight: 900;
}

.ss-category-v2__decision-card p,
.ss-category-v2__value-card span {
  display: block;
  color: var(--ss-cat-muted);
  font-size: .89rem;
  line-height: 1.5;
}

.ss-category-v2__value-card strong {
  display: block;
  margin-bottom: 7px;
  color: var(--ss-cat-dark);
  font-size: .98rem;
}

.ss-category-v2__need-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
}

.ss-category-v2__need-card,
.ss-category-v2__link-grid > a {
  display: flex;
  min-width: 0;
  flex-direction: column;
  padding: 16px;
  border: 1px solid var(--ss-cat-border);
  border-radius: 14px;
  background: #fff;
  color: var(--ss-cat-dark) !important;
  text-decoration: none !important;
  transition: border-color .15s ease, transform .15s ease, box-shadow .15s ease;
}

.ss-category-v2__need-card:hover,
.ss-category-v2__link-grid > a:hover {
  border-color: var(--ss-cat-teal);
  box-shadow: 0 8px 24px rgba(17,24,28,.07);
  transform: translateY(-1px);
}

.ss-category-v2__need-card strong,
.ss-category-v2__link-grid strong {
  margin-bottom: 6px;
  color: var(--ss-cat-dark);
  font-size: 1rem;
  line-height: 1.3;
}

.ss-category-v2__need-card span,
.ss-category-v2__link-grid span {
  color: var(--ss-cat-muted);
  font-size: .88rem;
  line-height: 1.48;
}

.ss-category-v2__need-card em {
  margin-top: 12px;
  color: var(--ss-cat-teal-dark);
  font-size: .82rem;
  font-style: normal;
  font-weight: 900;
}

.ss-category-v2__need-card em::after { content: "  →"; }

.ss-category-v2__guide-banner {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 24px;
  align-items: center;
  padding: 24px;
  border-radius: 18px;
  background: var(--ss-cat-dark);
}

.ss-category-v2__guide-banner h2,
.ss-category-v2__guide-banner p { color: #fff; }
.ss-category-v2__guide-banner .ss-category-v2__eyebrow { color: #67dbe0 !important; }
.ss-category-v2__guide-banner p:last-child { color: #c4d0d4; }

.ss-category-v2__button--light {
  border-color: var(--ss-cat-teal);
  background: var(--ss-cat-teal);
  white-space: nowrap;
}

.ss-category-v2__link-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}

.ss-category-v2__faq-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}

.ss-category-v2__faq-grid article {
  padding: 16px;
  border: 1px solid var(--ss-cat-border);
  border-radius: 14px;
  background: #f8fbfb;
}

.ss-category-v2__faq-grid p {
  color: var(--ss-cat-muted);
  font-size: .9rem;
  line-height: 1.52;
}

@media (max-width: 980px) {
  .ss-category-v2__top-grid { grid-template-columns: 1fr; gap: 16px; }
  .ss-category-v2__guide-card { max-width: 620px; }
  .ss-category-v2__decision-grid,
  .ss-category-v2__value-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .ss-category-v2__need-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 720px) {
  .ss-category-v2--top { padding: 19px; border-radius: 16px; }
  .ss-category-v2 h2 { font-size: 1.55rem; }
  .ss-category-v2__lead { font-size: 1rem !important; }
  .ss-category-v2__section { padding: 19px; border-radius: 16px; }
  .ss-category-v2__decision-grid,
  .ss-category-v2__value-grid,
  .ss-category-v2__need-grid,
  .ss-category-v2__link-grid,
  .ss-category-v2__faq-grid { grid-template-columns: 1fr; }
  .ss-category-v2__guide-banner { grid-template-columns: 1fr; padding: 20px; }
  .ss-category-v2__guide-banner .ss-category-v2__button { width: 100%; }
}


/* Legacy category-content compatibility.
   Existing category HTML can continue to use its current selectors while it is migrated gradually. */

.ss-cat-hero p,.ss-cat-bottom p { font-size: 1.125em; line-height: 1.6; }.ss-cat-hero,.ss-cat-bottom{background:#fff;border:1px solid #e6e8ee;border-radius:16px;padding:20px;margin:0 0 18px 0;}.ss-cat-hero h1{margin:8px 0 10px 0;font-size:2rem;line-height:1.15;}.ss-breadcrumb{display:flex;gap:8px;flex-wrap:wrap;font-size:.9em;color:#667085;margin-bottom:6px;}.ss-breadcrumb span:after{content:"&rsaquo;";margin-left:8px;color:#98a2b3;}.ss-breadcrumb span:last-child:after{content:"";}.ss-quick-grid,.ss-info-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-top:16px;}.ss-quick-grid div,.ss-info-card{background:#f7faff;border:1px solid #dbe8f8;border-radius:14px;padding:14px;}.ss-quick-grid strong{display:block;color:#2166AC;margin-bottom:6px;}.ss-quick-grid span{display:block;color:#344054;font-size:.95em;line-height:1.45;}.ss-info-card h3{margin-top:0;}.ss-link-list{display:grid;grid-template-columns:repeat(2,1fr);gap:10px;padding:0;list-style:none;margin:14px 0;}.ss-link-list li a{display:block;background:#f4f8ff;border:1px solid #d8e7fb;border-radius:12px;padding:12px 14px;text-decoration:none;color:#2166AC;font-weight:700;}.ss-eat-line{border-left:5px solid #2166AC;background:#f4f8ff;border-radius:12px;padding:14px 16px;margin-top:16px;}@media(max-width:820px){.ss-quick-grid,.ss-info-grid,.ss-link-list{grid-template-columns:1fr;}.ss-cat-hero h1{font-size:1.6rem;}}

.ss410-top,.ss410-top * {  box-sizing: border-box;}.ss410-top {  --ss410-teal: #00adb5;  --ss410-teal-dark: #007f86;  --ss410-yellow: #fed766;  --ss410-dark: #11181c;  --ss410-copy: #30464c;  --ss410-muted: #5b6d74;  --ss410-border: #d7e8e9;  --ss410-soft: #f2fbfb;  margin: 0 0 22px;  padding: clamp(22px, 4vw, 38px);  overflow: hidden;  border: 1px solid var(--ss410-border);  border-radius: 22px;  background:    radial-gradient(      circle at 93% 8%,      rgba(254, 215, 102, 0.3),      transparent 27%    ),    linear-gradient(135deg, #eefafa 0%, #ffffff 72%);  color: var(--ss410-dark);}.ss410-top__grid {  display: grid;  grid-template-columns: minmax(0, 1.35fr) minmax(280px, 0.65fr);  gap: 28px;  align-items: center;}.ss410-top__eyebrow {  display: inline-flex;  margin-bottom: 12px;  padding: 7px 11px;  border: 1px solid #bce7e9;  border-radius: 999px;  background: #e5f8f8;  color: var(--ss410-teal-dark);  font-size: 0.78rem;  font-weight: 900;  letter-spacing: 0.065em;  text-transform: uppercase;}.ss410-top__copy h2 {  margin: 0 0 16px;  color: var(--ss410-dark);  font-size: clamp(1.85rem, 4vw, 2.9rem);  line-height: 1.08;  letter-spacing: -0.035em;}.ss410-top__copy > p {  margin: 0 0 12px;  color: var(--ss410-copy);  font-size: 1.04rem;  line-height: 1.65;}.ss410-top__copy .ss410-top__note {  margin-bottom: 0;  color: var(--ss410-muted);  font-size: 0.9rem;}.ss410-top__benefits {  display: grid;  gap: 10px;}.ss410-top__benefit {  padding: 15px 17px;  border: 1px solid var(--ss410-border);  border-radius: 14px;  background: rgba(255, 255, 255, 0.92);}.ss410-top__benefit strong,.ss410-top__benefit span {  display: block;}.ss410-top__benefit strong {  margin-bottom: 4px;  color: var(--ss410-dark);}.ss410-top__benefit span {  color: var(--ss410-muted);  font-size: 0.9rem;  line-height: 1.45;}.ss410-top__brands {  display: flex;  flex-wrap: wrap;  gap: 9px;  align-items: center;  margin-top: 24px;  padding-top: 19px;  border-top: 1px solid var(--ss410-border);}.ss410-top__brands > span {  margin-right: 3px;  color: var(--ss410-muted);  font-size: 0.88rem;  font-weight: 800;}.ss410-top__brands a {  display: inline-flex;  min-height: 37px;  align-items: center;  padding: 7px 13px;  border: 1px solid var(--ss410-border);  border-radius: 999px;  background: #ffffff;  color: var(--ss410-teal-dark);  font-size: 0.87rem;  font-weight: 900;  text-decoration: none;}.ss410-top__brands a:hover {  border-color: var(--ss410-teal);  background: var(--ss410-teal);  color: #ffffff;}@media (max-width: 860px) {  .ss410-top__grid {    grid-template-columns: 1fr;    gap: 20px;  }  .ss410-top {    padding: 20px;    border-radius: 18px;  }  .ss410-top__brands > span {    width: 100%;  }}
.ss410-bottom,.ss410-bottom * {  box-sizing: border-box;}.ss410-bottom {  --ss410-teal: #00adb5;  --ss410-teal-dark: #007f86;  --ss410-yellow: #fed766;  --ss410-dark: #11181c;  --ss410-copy: #30464c;  --ss410-muted: #5b6d74;  --ss410-border: #d7e8e9;  --ss410-soft: #f3fbfb;  --ss410-warm: #fff9e8;  max-width: 1180px;  margin: 26px auto 0;  color: var(--ss410-dark);  line-height: 1.65;  text-align: left !important;}.ss410-bottom h2,.ss410-bottom h3,.ss410-bottom p,.ss410-bottom span,.ss410-bottom strong,.ss410-bottom a {  text-align: left !important;}.ss410-bottom h2,.ss410-bottom h3,.ss410-bottom p {  margin-top: 0;}.ss410-bottom p {  color: var(--ss410-muted);}.ss410-bottom a {  color: inherit;}.ss410-bottom__intro,.ss410-bottom__section,.ss410-bottom__aeo {  margin: 0 0 22px;  padding: clamp(24px, 4vw, 38px);  border: 1px solid var(--ss410-border);  border-radius: 20px;  background: #ffffff;}.ss410-bottom__intro {  background:    linear-gradient(90deg, rgba(0, 173, 181, 0.07), transparent 55%),    #ffffff;}.ss410-bottom__section--soft {  background: var(--ss410-soft);}.ss410-bottom__label,.ss410-bottom__section-label {  display: inline-flex;  align-items: center;  width: fit-content;  margin: 0 0 9px;  color: var(--ss410-teal-dark);  font-size: 0.76rem;  font-weight: 900;  letter-spacing: 0.075em;  line-height: 1.3;  text-transform: uppercase;}.ss410-bottom__intro h2,.ss410-bottom__head h2,.ss410-bottom__guide h2,.ss410-bottom__aeo h2 {  margin: 0 0 11px;  color: var(--ss410-dark);  font-size: clamp(1.55rem, 3vw, 2.05rem);  line-height: 1.18;  letter-spacing: -0.025em;}.ss410-bottom__intro > p,.ss410-bottom__head p,.ss410-bottom__aeo-copy p {  max-width: 850px;  margin-bottom: 0;}.ss410-bottom__answer {  max-width: 980px;  margin-top: 18px;  padding: 16px 18px;  border-left: 4px solid var(--ss410-yellow);  border-radius: 0 14px 14px 0;  background: #ffffff;  color: var(--ss410-copy);}.ss410-bottom__answer strong {  color: var(--ss410-dark);}.ss410-bottom__aeo {  display: grid;  grid-template-columns: minmax(0, 1.08fr) minmax(320px, 0.92fr);  gap: 22px;  align-items: stretch;  background:    radial-gradient(circle at 100% 0%, rgba(254, 215, 102, 0.26), transparent 32%),    linear-gradient(135deg, #f3fbfb 0%, #ffffff 58%, #fff9e8 100%);}.ss410-bottom__aeo-facts {  display: grid;  grid-template-columns: repeat(2, minmax(0, 1fr));  gap: 10px;}.ss410-bottom__aeo-facts div {  padding: 16px;  border: 1px solid rgba(0, 173, 181, 0.18);  border-radius: 15px;  background: #ffffff;}.ss410-bottom__aeo-facts strong,.ss410-bottom__aeo-facts span {  display: block;}.ss410-bottom__aeo-facts strong {  margin-bottom: 5px;  color: var(--ss410-dark);  font-size: 0.95rem;}.ss410-bottom__aeo-facts span {  color: var(--ss410-muted);  font-size: 0.88rem;  line-height: 1.5;}.ss410-bottom__head {  max-width: 860px;  margin-bottom: 20px;}.ss410-bottom__head p {  margin-bottom: 0;}.ss410-bottom__need-grid {  display: grid;  grid-template-columns: repeat(4, minmax(0, 1fr));  gap: 13px;}.ss410-bottom__need-card {  display: flex;  min-height: 190px;  flex-direction: column;  justify-content: flex-start;  padding: 19px;  border: 1px solid var(--ss410-border);  border-radius: 15px;  background: var(--ss410-soft);  color: var(--ss410-dark) !important;  text-decoration: none !important;  transition: transform 0.18s ease, border-color 0.18s ease, background 0.18s ease;}.ss410-bottom__need-card:hover {  transform: translateY(-2px);  border-color: var(--ss410-teal);  background: #ffffff;}.ss410-bottom__need-number {  display: block;  margin-bottom: 12px;  color: var(--ss410-teal-dark);  font-size: 0.75rem;  font-weight: 900;  letter-spacing: 0.08em;  text-transform: uppercase;}.ss410-bottom__need-card strong {  display: block;  margin-bottom: 8px;  color: var(--ss410-dark);  font-size: 0.98rem;  line-height: 1.35;}.ss410-bottom__need-text {  display: block;  color: var(--ss410-muted);  font-size: 0.9rem;  line-height: 1.5;}.ss410-bottom__need-card--guide {  background: var(--ss410-dark);  color: #ffffff !important;}.ss410-bottom__need-card--guide:hover {  background: #18242a;}.ss410-bottom__need-card--guide .ss410-bottom__need-number {  color: #82e3e7;}.ss410-bottom__need-card--guide strong {  color: #ffffff;}.ss410-bottom__need-card--guide .ss410-bottom__need-text {  color: rgba(255, 255, 255, 0.76);}.ss410-bottom__criteria-grid,.ss410-bottom__brand-grid,.ss410-bottom__faq-grid {  display: grid;  gap: 13px;}.ss410-bottom__criteria-grid {  grid-template-columns: repeat(4, minmax(0, 1fr));}.ss410-bottom__criterion,.ss410-bottom__brand-grid a,.ss410-bottom__faq-grid article,.ss410-bottom__related-grid a {  padding: 19px;  border: 1px solid var(--ss410-border);  border-radius: 15px;  background: #ffffff;}.ss410-bottom__criterion span {  display: inline-flex;  margin-bottom: 11px;  color: var(--ss410-teal-dark);  font-size: 0.76rem;  font-weight: 900;  letter-spacing: 0.08em;}.ss410-bottom__criterion h3,.ss410-bottom__faq-grid h3 {  margin-bottom: 7px;  color: var(--ss410-dark);  font-size: 1rem;}.ss410-bottom__criterion p,.ss410-bottom__faq-grid p {  margin-bottom: 0;  font-size: 0.91rem;}.ss410-bottom__note {  margin: 0 0 22px;  padding: 18px 20px;  border-left: 4px solid var(--ss410-yellow);  border-radius: 0 15px 15px 0;  background: var(--ss410-warm);}.ss410-bottom__note strong {  display: block;  margin-bottom: 5px;  color: var(--ss410-dark);}.ss410-bottom__note p {  margin: 0;}.ss410-bottom__brand-grid {  grid-template-columns: repeat(3, minmax(0, 1fr));}.ss410-bottom__brand-grid a,.ss410-bottom__related-grid a {  display: block;  color: var(--ss410-dark) !important;  text-decoration: none !important;}.ss410-bottom__brand-grid a:hover,.ss410-bottom__related-grid a:hover {  border-color: var(--ss410-teal);  background: var(--ss410-soft);}.ss410-bottom__brand-grid strong,.ss410-bottom__brand-grid span,.ss410-bottom__related-grid strong,.ss410-bottom__related-grid span {  display: block;}.ss410-bottom__brand-grid strong,.ss410-bottom__related-grid strong {  margin-bottom: 5px;  color: var(--ss410-teal-dark);}.ss410-bottom__brand-grid span,.ss410-bottom__related-grid span {  color: var(--ss410-muted);  font-size: 0.89rem;  line-height: 1.55;}.ss410-bottom__guide {  display: grid;  grid-template-columns: minmax(0, 1fr) auto;  gap: 24px;  align-items: center;  margin: 0 0 22px;  padding: clamp(25px, 4vw, 40px);  border-radius: 20px;  background:    radial-gradient(circle at 92% 12%, rgba(254, 215, 102, 0.24), transparent 28%),    var(--ss410-dark);  color: #ffffff;}.ss410-bottom__guide span {  display: block;  margin-bottom: 7px;  color: #86e3e7;  font-size: 0.76rem;  font-weight: 900;  letter-spacing: 0.08em;  text-transform: uppercase;}.ss410-bottom__guide h2 {  color: #ffffff;}.ss410-bottom__guide p {  max-width: 740px;  margin-bottom: 0;  color: rgba(255, 255, 255, 0.76);}.ss410-bottom__guide-link {  display: inline-flex;  min-height: 47px;  align-items: center;  justify-content: center;  padding: 11px 18px;  border: 1px solid var(--ss410-teal);  border-radius: 999px;  background: var(--ss410-teal);  color: #ffffff !important;  font-weight: 900;  text-decoration: none !important;  white-space: nowrap;}.ss410-bottom__guide-link:hover {  border-color: #ffffff;  background: #ffffff;  color: var(--ss410-teal-dark) !important;}.ss410-bottom__related-grid {  display: grid;  grid-template-columns: repeat(2, minmax(0, 1fr));  gap: 12px;}.ss410-bottom__faq-grid {  grid-template-columns: repeat(2, minmax(0, 1fr));}@media (max-width: 980px) {  .ss410-bottom__aeo,  .ss410-bottom__guide {    grid-template-columns: 1fr;  }  .ss410-bottom__need-grid,  .ss410-bottom__criteria-grid,  .ss410-bottom__brand-grid {    grid-template-columns: repeat(2, minmax(0, 1fr));  }  .ss410-bottom__guide-link {    justify-self: start;  }}@media (max-width: 720px) {  .ss410-bottom__intro,  .ss410-bottom__section,  .ss410-bottom__aeo,  .ss410-bottom__guide {    padding: 20px;    border-radius: 17px;  }  .ss410-bottom__aeo-facts,  .ss410-bottom__need-grid,  .ss410-bottom__criteria-grid,  .ss410-bottom__brand-grid,  .ss410-bottom__related-grid,  .ss410-bottom__faq-grid {    grid-template-columns: 1fr;  }  .ss410-bottom__need-card {    min-height: 0;  }  .ss410-bottom__guide-link {    width: 100%;    white-space: normal;    text-align: center !important;  }}
