* {
  box-sizing:border-box;
  margin:0;
  padding:0
}

:root {
  --bg:#08080d;
  --panel:#111119;
  --panel2:#171720;
  --text:#f7f7fb;
  --muted:#a5a5b2;
  --yellow:#ffd43b;
  --yellow2:#ffb800;
  --line:rgba(255,255,255,
  .09);
  --max:1180px
}

html {
  scroll-behavior:smooth
}

body {
  font-family:Inter,
  Arial,
  sans-serif;
  background:#fff;
  color:#15151b;
  line-height:1.6
}

a {
  text-decoration:none;
  color:inherit
}

.container {
  width:min(calc(100% - 40px),
  var(--max));
  margin:auto
}

.announcement {
  background:#f7c900;
  color:#111;
  font-size:13px;
  font-weight:700
}

.announcement-inner {
  min-height:38px;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:13px
}

.announcement a {
  margin-left:auto;
  text-decoration:underline
}

.site-header {
  position:sticky;
  top:0;
  z-index:50;
  background:rgba(8,8,13,
  .92);
  backdrop-filter:blur(16px);
  color:white;
  border-bottom:1px solid var(--line)
}

.nav {
  height:76px;
  display:flex;
  align-items:center;
  gap:35px
}

.brand {
  display:flex;
  align-items:center;
  gap:10px;
  line-height:1
}

.brand-mark {
  font-size:29px;
  color:var(--yellow);
  filter:drop-shadow(0 0 12px rgba(255,212,59,
  .25))
}

.brand strong {
  display:block;
  font-size:18px;
  letter-spacing:2px
}

.brand small {
  display:block;
  font-size:9px;
  letter-spacing:3px;
  color:#aaa;
  margin-top:4px
}

.desktop-nav {
  display:flex;
  gap:30px;
  margin-left:auto
}

.desktop-nav a {
  font-size:14px;
  color:#bbb;
  transition:.2s
}

.desktop-nav a:hover {
  color:white
}

.nav-cta {
  background:var(--yellow);
  color:#111;
  padding:11px 18px;
  border-radius:9px;
  font-weight:800;
  font-size:13px
}

.hero {
  position:relative;
  overflow:hidden;
  background:radial-gradient(circle at 80% 30%,
  #2b2510 0,
  #101015 34%,
  #08080d 70%);
  color:white;
  padding:92px 0 78px
}

.hero-grid {
  display:grid;
  grid-template-columns:1.05fr .95fr;
  align-items:center;
  gap:60px;
  position:relative;
  z-index:2
}

.eyebrow,
  .section-kicker,
  .deal-kicker {
  font-size:11px;
  font-weight:800;
  letter-spacing:2px;
  text-transform:uppercase
}

.eyebrow {
  display:inline-flex;
  gap:8px;
  align-items:center;
  border:1px solid rgba(255,212,59,
  .25);
  background:rgba(255,212,59,
  .08);
  padding:8px 12px;
  border-radius:100px;
  color:#ffe27a
}

.hero h1 {
  font-size:clamp(48px,6vw,82px);
  line-height:.98;
  letter-spacing:-4px;
  margin:24px 0 22px
}

.hero h1 span,
  .section-heading h2 span,
  .why-copy h2 span,
  .reviews-top h2 span,
  .final-cta h2 span {
  color:var(--yellow)
}

.hero-lead {
  font-size:18px;
  color:#b9b9c3;
  max-width:650px
}

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

.btn {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:12px;
  padding:14px 21px;
  border-radius:10px;
  font-weight:800;
  font-size:14px;
  transition:.2s
}

.btn:hover {
  transform:translateY(-2px)
}

.btn-primary {
  background:var(--yellow);
  color:#111;
  box-shadow:0 12px 30px rgba(255,204,0,
  .15)
}

.btn-secondary {
  border:1px solid rgba(255,255,255,
  .16);
  color:white;
  background:rgba(255,255,255,
  .04)
}

.btn-light {
  background:white;
  color:#111
}

.trust-row {
  display:flex;
  gap:0;
  margin-top:20px
}

.trust-row>div {
  padding:0 25px;
  border-left:1px solid rgba(255,255,255,
  .12)
}

.trust-row>div:first-child {
  padding-left:0;
  border-left:0
}

.trust-row b {
  display:block;
  font-size:17px
}

.trust-row span {
  font-size:11px;
  color:#888
}

.hero-visual {
  min-height:500px;
  position:relative;
  display:flex;
  align-items:center;
  justify-content:center
}

.device-card {
  width:275px;
  height:530px;
  border:8px solid #292932;
  border-radius:42px;
  background:#050508;
  box-shadow:0 40px 80px rgba(0,0,0,
  .5),0 0 80px rgba(255,204,0,
  .08);
  transform:rotate(7deg);
  position:relative
}

.device-top {
  position:absolute;
  width:95px;
  height:24px;
  background:#292932;
  border-radius:0 0 18px 18px;
  top:-1px;
  left:50%;
  transform:translateX(-50%);
  z-index:2
}

.device-screen {
  position:absolute;
  inset:6px;
  border-radius:34px;
  background:radial-gradient(circle at 50% 35%,
  #3b320e,
  #15130a 40%,
  #050508 75%);
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center
}

.screen-lightning {
  font-size:95px;
  color:var(--yellow);
  text-shadow:0 0 35px rgba(255,212,59,
  .4)
}

.screen-title {
  font-weight:900;
  font-size:15px;
  letter-spacing:3px;
  margin-top:15px
}

.screen-sub {
  font-size:8px;
  letter-spacing:3px;
  color:#888;
  margin-top:5px
}

.device-bottom {
  position:absolute;
  bottom:8px;
  left:50%;
  transform:translateX(-50%);
  height:4px;
  width:85px;
  background:#333;
  border-radius:10px
}

.floating-card {
  position:absolute;
  display:flex;
  gap:12px;
  align-items:center;
  background:rgba(25,25,32,
  .94);
  border:1px solid rgba(255,255,255,
  .1);
  box-shadow:0 20px 50px rgba(0,0,0,
  .3);
  padding:14px 16px;
  border-radius:14px;
  backdrop-filter:blur(12px)
}

.floating-card strong {
  display:block;
  font-size:13px
}

.floating-card small {
  display:block;
  color:#999;
  font-size:10px
}

.offer-card {
  left:0;
  top:90px
}

.location-card {
  right:0;
  bottom:80px
}

.offer-icon {
  font-size:25px;
  color:var(--yellow)
}

.quick-strip {
  background:#f5f5f6;
  border-bottom:1px solid #e7e7e9
}

.quick-grid {
  display:grid;
  grid-template-columns:repeat(4,1fr)
}

.quick-grid>div {
  padding:24px 20px;
  border-right:1px solid #ddd;
  display:grid;
  grid-template-columns:28px 1fr;
  column-gap:8px
}

.quick-grid>div:last-child {
  border-right:0
}

.quick-grid span {
  grid-row:span 2;
  color:#9b7900;
  font-weight:900
}

.quick-grid strong {
  font-size:13px
}

.quick-grid small {
  font-size:11px;
  color:#777
}

.section {
  padding:105px 0
}

.section-heading {
  display:flex;
  justify-content:space-between;
  align-items:end;
  gap:50px;
  margin-bottom:45px
}

.section-kicker {
  color:#9a7a00;
  display:block;
  margin-bottom:10px
}

.section-heading h2,
  .why-copy h2,
  .reviews-top h2 {
  font-size:clamp(36px,4vw,58px);
  line-height:1.03;
  letter-spacing:-2px
}

.section-heading>p {
  max-width:420px;
  color:#777;
  font-size:15px
}

.repair-grid {
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:16px
}

.repair-card {
  min-height:245px;
  background:#f6f6f7;
  border:1px solid #e7e7ea;
  border-radius:18px;
  padding:27px;
  display:flex;
  flex-direction:column;
  justify-content:space-between;
  transition:.25s
}

.repair-card:hover {
  transform:translateY(-5px);
  border-color:#d3b200;
  box-shadow:0 18px 45px rgba(0,0,0,
  .08)
}

.repair-card.featured {
  background:#111118;
  color:white;
  border-color:#22222c
}

.card-icon {
  width:48px;
  height:48px;
  border-radius:13px;
  background:#e6e6e9;
  display:grid;
  place-items:center;
  font-size:27px;
  font-weight:900
}

.featured .card-icon {
  background:var(--yellow);
  color:#111
}

.card-tag {
  font-size:9px;
  font-weight:900;
  letter-spacing:2px;
  color:#a58b17
}

.card-content h3 {
  font-size:22px;
  margin:10px 0 4px
}

.card-content p {
  font-size:13px;
  color:#777;
  max-width:270px
}

.featured .card-content p {
  color:#999
}

.card-content strong {
  display:block;
  margin-top:14px;
  font-size:12px
}

.samsung {
  font-size:20px
}

.pixel {
  font-size:18px
}

.moto {
  font-size:18px
}

.ipad {
  font-size:22px
}

.deal-section {
  background:#08080d;
  color:white;
  padding:35px 0
}

.deal-card {
  min-height:370px;
  border-radius:25px;
  padding:60px;
  display:flex;
  justify-content:space-between;
  align-items:center;
  overflow:hidden;
  background:radial-gradient(circle at 80% 50%,
  #3a310d,
  #171716 35%,
  #111116 75%);
  position:relative
}

.deal-copy {
  position:relative;
  z-index:2
}

.deal-kicker {
  color:var(--yellow)
}

.deal-card h2 {
  font-size:clamp(40px,5vw,62px);
  line-height:1;
  margin:12px 0
}

.deal-card h2 span {
  color:var(--yellow)
}

.deal-card p {
  color:#aaa;
  max-width:520px;
  margin-bottom:22px
}

.deal-badge {
  width:245px;
  height:245px;
  border:1px solid rgba(255,212,59,
  .4);
  border-radius:50%;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  background:rgba(255,212,59,
  .05);
  transform:rotate(7deg);
  margin-right:35px;
  flex-shrink:0
}

.deal-badge small {
  font-size:9px;
  letter-spacing:3px;
  color:#aaa
}

.deal-badge strong {
  font-size:38px
}

.deal-badge span {
  font-size:11px;
  color:#bbb
}

.deal-badge i {
  font-style:normal;
  font-size:30px;
  color:var(--yellow);
  margin-top:8px
}

.why-section {
  background:#f5f5f6
}

.why-grid {
  display:grid;
  grid-template-columns:.9fr 1.1fr;
  gap:90px;
  align-items:center
}

.why-visual {
  height:520px;
  position:relative
}

.bench-card {
  height:100%;
  border-radius:25px;
  background:linear-gradient(145deg,
  #22222b,
  #0d0d12);
  display:flex;
  align-items:center;
  justify-content:center;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,
  .08)
}

.bench-bolt {
  font-size:140px;
  color:var(--yellow);
  filter:drop-shadow(0 0 40px rgba(255,210,40,
  .3))
}

.bench-label {
  position:absolute;
  bottom:35px;
  left:35px;
  color:#aaa;
  font-size:10px;
  letter-spacing:3px
}

.bench-label b {
  color:white
}

.experience-badge {
  position:absolute;
  right:-35px;
  top:40px;
  background:var(--yellow);
  width:125px;
  height:125px;
  border-radius:50%;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  color:#111;
  transform:rotate(8deg)
}

.experience-badge strong {
  font-size:32px;
  line-height:1
}

.experience-badge span {
  font-size:10px;
  text-align:center;
  font-weight:800;
  line-height:1.2;
  margin-top:5px
}

.why-copy>p {
  color:#666;
  margin:18px 0;
  max-width:600px
}

.check-list {
  margin-top:28px;
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:18px
}

.check-list>div {
  display:flex;
  gap:12px
}

.check-list>div>span {
  width:27px;
  height:27px;
  border-radius:50%;
  background:#e9d66d;
  color:#665400;
  display:grid;
  place-items:center;
  font-weight:900;
  flex-shrink:0
}

.check-list b {
  display:block;
  font-size:13px
}

.check-list small {
  display:block;
  color:#777;
  font-size:11px;
  margin-top:2px
}

.story-section {
  background:#fff;
  padding:105px 0
}

.story-grid {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:100px;
  align-items:center
}

.story-grid h2 {
  font-size:48px;
  line-height:1.05;
  letter-spacing:-2px;
  margin-bottom:20px
}

.story-grid p {
  color:#666;
  max-width:560px;
  margin:12px 0
}

.text-link {
  display:inline-block;
  margin-top:20px;
  font-weight:800;
  font-size:13px;
  border-bottom:2px solid var(--yellow)
}

.story-quote {
  background:#111118;
  color:white;
  border-radius:25px;
  padding:55px;
  min-height:310px;
  display:flex;
  flex-direction:column;
  justify-content:center
}

.story-quote>span {
  font-size:80px;
  color:var(--yellow);
  height:55px;
  line-height:1
}

.story-quote blockquote {
  font-size:29px;
  line-height:1.25;
  font-weight:700;
  letter-spacing:-1px
}

.story-quote small {
  color:#888;
  margin-top:20px
}

.reviews-section {
  background:#f5f5f6;
  padding:100px 0
}

.reviews-top {
  display:flex;
  justify-content:space-between;
  align-items:end;
  margin-bottom:40px
}

.rating {
  display:grid;
  text-align:right
}

.rating strong {
  font-size:54px;
  line-height:1
}

.rating span {
  color:#d2a800;
  font-size:20px;
  letter-spacing:2px
}

.rating small {
  font-size:11px;
  color:#777
}

.review-grid {
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:16px
}

.review-card {
  background:white;
  border:1px solid #e5e5e7;
  border-radius:18px;
  padding:28px
}

.stars {
  color:#d4aa00;
  letter-spacing:3px;
  margin-bottom:16px
}

.review-card p {
  font-size:14px;
  line-height:1.7;
  color:#555;
  min-height:125px
}

.review-card strong {
  display:block;
  font-size:13px;
  margin-top:18px
}

.review-card small {
  font-size:10px;
  color:#999
}

.reviews-cta {
  margin-top:22px;
  display:flex;
  justify-content:space-between;
  background:#111118;
  color:white;
  border-radius:14px;
  padding:17px 20px;
  font-size:12px
}

.reviews-cta a {
  color:var(--yellow);
  font-weight:800
}

.mail-section {
  padding:70px 0
}

.mail-card {
  background:#f1f1f2;
  border-radius:22px;
  padding:50px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:30px
}

.mail-card h2 {
  font-size:36px;
  line-height:1;
  margin:7px 0
}

.mail-card p {
  color:#777;
  max-width:650px;
  font-size:14px
}

.faq-section {
  padding:100px 0;
  background:white
}

.faq-grid {
  display:grid;
  grid-template-columns:.8fr 1.2fr;
  gap:90px
}

.faq-grid h2 {
  font-size:48px;
  line-height:1.05;
  letter-spacing:-2px;
  margin-bottom:28px
}

.faq-list {
  border-top:1px solid #ddd
}

.faq-list details {
  border-bottom:1px solid #ddd;
  padding:20px 0
}

.faq-list summary {
  cursor:pointer;
  font-weight:800;
  font-size:15px;
  list-style:none;
  display:flex;
  justify-content:space-between
}

.faq-list summary:after {
  content:"+";
  font-size:20px;
  color:#a18200
}

.faq-list details[open] summary:after {
  content:"–"
}

.faq-list p {
  color:#777;
  font-size:13px;
  max-width:700px;
  margin-top:12px
}

.final-cta {
  background:#08080d;
  color:white;
  text-align:center;
  padding:100px 0
}

.final-inner {
  display:flex;
  flex-direction:column;
  align-items:center
}

.final-cta .bolt {
  font-size:38px;
  color:var(--yellow);
  margin-bottom:10px
}

.final-cta h2 {
  font-size:clamp(45px,6vw,75px);
  line-height:1;
  letter-spacing:-3px;
  margin:10px 0
}

.final-cta p {
  color:#888;
  font-size:13px
}

.final-cta .hero-actions {
  justify-content:center
}

.footer {
  background:#050507;
  color:white;
  padding:60px 0 25px;
  border-top:1px solid #16161d
}

.footer-grid {
  display:grid;
  grid-template-columns:2fr 1fr 1fr 1fr;
  gap:30px
}

.footer-grid>div>strong {
  font-size:12px;
  letter-spacing:1px
}

.footer-grid p {
  color:#888;
  font-size:12px;
  margin-top:10px
}

.footer-grid a {
  color:#ccc
}

.footer-bottom {
  border-top:1px solid #18181e;
  margin-top:40px;
  padding-top:20px;
  display:flex;
  justify-content:space-between;
  color:#555;
  font-size:10px
}

@media(max-width:900px) {
  .desktop-nav {
  display:none
}

.nav {
  justify-content:space-between
}

.hero-grid,
  .why-grid,
  .story-grid,
  .faq-grid {
  grid-template-columns:1fr
}

.hero {
  padding:65px 0
}

.hero-visual {
  min-height:480px
}

.section-heading {
  display:block
}

.section-heading>p {
  margin-top:18px
}

.repair-grid {
  grid-template-columns:1fr 1fr
}

.deal-card {
  padding:40px
}

.deal-badge {
  display:none
}

.why-grid {
  gap:45px
}

.why-visual {
  height:420px
}

.review-grid {
  grid-template-columns:1fr
}

.footer-grid {
  grid-template-columns:1.5fr 1fr 1fr
}

.mail-card {
  display:block
}

.mail-card .btn {
  margin-top:25px
}

}

@media(max-width:600px) {
  .container {
  width:min(calc(100% - 28px),
  var(--max))
}

.announcement-inner {
  font-size:10px;
  gap:7px
}

.announcement-inner a {
  display:none
}

.announcement-sep {
  display:none
}

.nav {
  height:66px
}

.brand strong {
  font-size:16px
}

.nav-cta {
  padding:9px 12px;
  font-size:11px
}

.hero h1 {
  font-size:51px;
  letter-spacing:-3px
}

.hero-lead {
  font-size:15px
}

.hero-actions .btn {
  width:100%
}

.trust-row {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:18px
}

.trust-row>div {
  padding:0!important;
  border:0!important
}

.hero-visual {
  min-height:410px
}

.device-card {
  width:210px;
  height:390px;
  border-radius:32px
}

.device-screen {
  border-radius:25px
}

.screen-lightning {
  font-size:70px
}

.floating-card {
  padding:10px
}

.offer-card {
  left:0;
  top:55px
}

.location-card {
  right:0;
  bottom:35px
}

.quick-grid {
  grid-template-columns:1fr 1fr
}

.quick-grid>div {
  border-bottom:1px solid #ddd
}

.section {
  padding:75px 0
}

.section-heading h2,
  .why-copy h2,
  .reviews-top h2 {
  font-size:42px
}

.repair-grid {
  grid-template-columns:1fr
}

.repair-card {
  min-height:210px
}

.deal-card {
  padding:38px 25px
}

.deal-card h2 {
  font-size:42px
}

.story-grid h2,
  .faq-grid h2 {
  font-size:40px
}

.story-quote {
  padding:35px;
  min-height:250px
}

.story-quote blockquote {
  font-size:24px
}

.reviews-top {
  align-items:start
}

.rating {
  display:none
}

.reviews-cta {
  display:block
}

.reviews-cta a {
  display:block;
  margin-top:8px
}

.mail-card {
  padding:30px
}

.footer-grid {
  grid-template-columns:1fr 1fr
}

.footer-brand {
  grid-column:1/-1
}

.footer-bottom {
  display:block
}

.footer-bottom span {
  display:block;
  margin-top:6px
}

}