
:root{
  --tc-navy:#111827;
  --tc-navy2:#18233f;
  --tc-blue:#2563eb;
  --tc-coral:#ff5b61;
  --tc-text:#101828;
  --tc-muted:#667085;
  --tc-border:#e7ebf0;
  --tc-bg:#f8fafc;
  --tc-green:#16a34a;
  --tc-orange:#f59e0b;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:var(--tc-text);background:#fff}
a{text-decoration:none;color:inherit}
button,input{font:inherit}
button{cursor:pointer}
.tc-container{width:min(1180px,calc(100% - 40px));margin:0 auto}

/* Header */
.tc-header{height:76px;background:var(--tc-navy);color:#fff;position:sticky;top:0;z-index:100;border-bottom:1px solid rgba(255,255,255,.08)}
.tc-nav{height:100%;display:flex;align-items:center;justify-content:space-between;gap:30px}
.tc-logo{display:flex;align-items:center;gap:9px;font-size:22px;font-weight:800;letter-spacing:-.7px;white-space:nowrap}
.tc-logo>span:nth-child(2)>span{color:#ff666b}
.tc-logo small{font-size:11px;color:#aeb7c7;margin-left:2px}
.tc-logo-mark{font-size:23px;color:#ff666b}
.tc-desktop-nav{display:flex;align-items:center;gap:34px;font-size:14px;font-weight:600;color:#e7ebf3}
.tc-desktop-nav a:hover{color:#fff}
.tc-nav-actions{display:flex;align-items:center;gap:10px}
.tc-icon-btn,.tc-menu-btn{width:42px;height:42px;border:0;border-radius:50%;background:#273149;color:#fff;font-size:23px}
.tc-signin{border:1px solid #475269;background:transparent;color:#fff;border-radius:10px;padding:10px 16px}
.tc-menu-btn{display:none}

/* Trending */
.tc-trending-bar{background:var(--tc-navy2);color:#e7ebf3}
.tc-trending-inner{height:46px;display:flex;align-items:center;gap:26px;overflow:auto;white-space:nowrap;font-size:13px}
.tc-trending-inner a:hover{color:#fff}
.tc-trending-label{background:var(--tc-coral);color:#fff;padding:7px 15px;border-radius:999px;font-size:12px;font-weight:800}

/* Hero */
.tc-hero{background:linear-gradient(135deg,#f7fbff 0%,#eef5ff 55%,#fff6f1 100%);overflow:hidden}
.tc-hero-grid{min-height:445px;display:grid;grid-template-columns:1.05fr .95fr;align-items:center;gap:20px}
.tc-hero-copy{padding:64px 0 58px}
.tc-eyebrow,.tc-section-kicker{margin:0 0 10px;text-transform:uppercase;letter-spacing:1.5px;font-size:11px;font-weight:800;color:var(--tc-blue)}
.tc-hero h1{font-size:56px;line-height:1.04;letter-spacing:-3.3px;margin:0;font-weight:850}
.tc-hero h1 span{color:var(--tc-coral)}
.tc-hero-sub{font-size:22px;font-weight:700;margin:18px 0 5px}
.tc-hero-desc{font-size:15px;color:var(--tc-muted);max-width:600px;margin:0 0 25px;line-height:1.6}
.tc-search{height:58px;max-width:690px;background:#fff;border:1px solid #dfe6ee;border-radius:13px;display:flex;align-items:center;padding:6px 7px 6px 16px;box-shadow:0 14px 34px rgba(28,52,84,.10)}
.tc-search-icon{font-size:23px;color:#98a2b3}
.tc-search input{flex:1;min-width:0;border:0;outline:0;padding:0 12px;color:var(--tc-text)}
.tc-search button{border:0;background:var(--tc-coral);color:#fff;border-radius:9px;padding:13px 25px;font-weight:700}
.tc-popular{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-top:13px;font-size:12px;color:var(--tc-muted)}
.tc-popular button{border:1px solid #dce3ec;background:#fff;border-radius:999px;padding:5px 10px;color:#344054}
.tc-popular button:hover{border-color:var(--tc-blue);color:var(--tc-blue)}
.tc-hero-visual{height:100%;min-height:400px;position:relative}
.tc-device{position:absolute;background:linear-gradient(145deg,#1e293b,#64748b);border:7px solid #111827;border-radius:25px;display:grid;place-items:center;color:#fff;box-shadow:0 25px 50px rgba(15,23,42,.22)}
.tc-device-one{width:145px;height:285px;right:230px;top:82px;transform:rotate(-8deg);font-size:60px}
.tc-device-two{width:150px;height:300px;right:95px;top:55px;transform:rotate(7deg);background:linear-gradient(145deg,#0f172a,#334155);font-size:62px}
.tc-device-three{width:280px;height:175px;right:0;bottom:43px;border-radius:13px;background:linear-gradient(145deg,#334155,#0f172a);font-size:55px}
.tc-earbuds{position:absolute;right:315px;bottom:52px;font-size:58px;filter:drop-shadow(0 12px 8px rgba(0,0,0,.15))}
.tc-watch{position:absolute;right:180px;bottom:27px;font-size:54px}
.tc-hero-note{position:absolute;left:20px;top:65px;font-size:18px;line-height:1.2;font-weight:800;transform:rotate(-7deg)}
.tc-hero-note span{color:var(--tc-coral)}

/* Feature cards */
.tc-tools{display:grid;grid-template-columns:repeat(5,1fr);gap:12px;padding-top:18px}
.tc-tool-card{min-height:116px;border:1px solid var(--tc-border);border-radius:15px;background:#fff;padding:18px;display:flex;gap:12px;align-items:flex-start;transition:.2s}
.tc-tool-card:hover{transform:translateY(-3px);box-shadow:0 12px 28px rgba(16,24,40,.07)}
.tc-tool-card>span:last-child{display:block}
.tc-tool-icon{width:42px;height:42px;border-radius:12px;display:grid;place-items:center;flex:none;font-size:20px}
.tc-blue{background:#eaf2ff;color:var(--tc-blue)}
.tc-green{background:#eaf8ef;color:var(--tc-green)}
.tc-orange{background:#fff2e6;color:#e68a16}
.tc-red{background:#fff0f1;color:var(--tc-coral)}
.tc-purple{background:#f3edff;color:#7c3aed}
.tc-tool-card b,.tc-tool-card small,.tc-tool-card em{display:block}
.tc-tool-card b{font-size:13px}
.tc-tool-card small{font-size:11px;color:var(--tc-muted);margin:4px 0 9px;line-height:1.4}
.tc-tool-card em{font-size:11px;color:var(--tc-blue);font-style:normal;font-weight:700}

/* Sections */
.tc-section{padding-top:62px}
.tc-section-head{display:flex;align-items:end;justify-content:space-between;gap:20px;margin-bottom:20px}
.tc-section-head h2{font-size:27px;line-height:1.1;letter-spacing:-1px;margin:0}
.tc-section-head>div>p:last-child{margin:7px 0 0;color:var(--tc-muted);font-size:13px}
.tc-section-head>a{color:var(--tc-blue);font-size:13px;font-weight:700;white-space:nowrap}
.tc-section-kicker{margin-bottom:5px;font-size:10px}

/* Product cards */
.tc-product-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
.tc-product-card{border:1px solid var(--tc-border);border-radius:16px;overflow:hidden;background:#fff;transition:.2s}
.tc-product-card:hover{transform:translateY(-3px);box-shadow:0 16px 32px rgba(16,24,40,.08)}
.tc-phone-visual,.tc-deal-image{height:205px;background:linear-gradient(145deg,#f5f7fa,#e9edf3);display:grid;place-items:center;position:relative;overflow:hidden}
.tc-phone-visual:after,.tc-deal-image:after{content:"";position:absolute;width:92px;height:175px;border-radius:22px;background:linear-gradient(145deg,#334155,#111827);box-shadow:0 18px 25px rgba(15,23,42,.20);transform:rotate(-8deg)}
.tc-phone-visual span,.tc-deal-image span{position:relative;z-index:2;color:#fff;font-size:26px;font-weight:800}
.tc-product-info{padding:16px}
.tc-product-category{font-size:11px;color:var(--tc-blue);font-weight:700;margin:0 0 5px}
.tc-product-info h3{font-size:16px;line-height:1.25;margin:0;min-height:40px}
.tc-score-row{display:flex;align-items:center;gap:7px;margin:12px 0;color:#7a8494;font-size:11px}
.tc-score{background:#eaf8ed;color:#15803d;border-radius:6px;padding:4px 7px;font-size:11px;font-weight:800}
.tc-price-line strong{font-size:17px}
.tc-product-actions{display:flex;gap:7px;margin-top:13px}
.tc-details-btn,.tc-buy-btn{flex:1;text-align:center;padding:9px 8px;border-radius:8px;font-size:11px;font-weight:700}
.tc-details-btn{background:#f1f4f7;color:#344054}
.tc-buy-btn{background:var(--tc-coral);color:#fff}

/* Deals */
.tc-deal-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:14px}
.tc-deal-card{border:1px solid var(--tc-border);border-radius:15px;overflow:hidden;background:#fff}
.tc-deal-image{height:155px}
.tc-deal-image:after{width:68px;height:125px}
.tc-deal-image span{font-size:20px}
.tc-deal-body{padding:14px}
.tc-deal-tag{display:inline-block;background:#eaf8ed;color:#15803d;border-radius:999px;padding:4px 8px;font-size:9px;font-weight:800}
.tc-deal-body h3{font-size:14px;line-height:1.25;margin:10px 0 3px;min-height:35px}
.tc-deal-body p{font-size:11px;color:var(--tc-muted);margin:0}
.tc-deal-price{font-size:17px;font-weight:800;margin:10px 0}
.tc-deal-btn{display:block;text-align:center;background:var(--tc-coral);color:#fff;border-radius:8px;padding:9px;font-size:11px;font-weight:700}
.tc-disabled{background:#eef1f4;color:#667085}

/* Compare */
.tc-compare-card{border:1px solid var(--tc-border);border-radius:18px;background:#f9fbff;padding:30px;display:grid;grid-template-columns:.8fr 1.2fr;gap:35px;align-items:center}
.tc-compare-copy h2{font-size:27px;letter-spacing:-1px;margin:0}
.tc-compare-copy>p:last-child{color:var(--tc-muted);font-size:13px;line-height:1.5}
.tc-compare-ui{display:grid;grid-template-columns:1fr auto 1fr;gap:10px;align-items:center}
.tc-compare-ui input{height:48px;border:1px solid #dfe5ec;background:#fff;border-radius:9px;padding:0 13px;outline:0;font-size:12px}
.tc-compare-ui>span{font-weight:800;color:#98a2b3;font-size:11px}
.tc-primary-btn{grid-column:1/-1;justify-self:end;border:0;background:var(--tc-blue);color:#fff;border-radius:9px;padding:12px 20px;font-size:12px;font-weight:700}
.tc-compare-note{grid-column:1/-1;margin:0;color:var(--tc-muted);font-size:11px;text-align:right}

/* Budget/category */
.tc-budget-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:12px}
.tc-budget-card,.tc-category-card{border:1px solid var(--tc-border);border-radius:13px;padding:17px 14px;display:flex;align-items:center;gap:10px;background:#fff;transition:.2s}
.tc-budget-card:hover,.tc-category-card:hover{border-color:#cbd5e1;box-shadow:0 10px 24px rgba(16,24,40,.06);transform:translateY(-2px)}
.tc-budget-icon,.tc-category-icon{width:36px;height:36px;border-radius:10px;background:#eef4ff;color:var(--tc-blue);display:grid;place-items:center;font-weight:800;flex:none}
.tc-budget-card strong,.tc-budget-card small,.tc-category-card strong,.tc-category-card small{display:block}
.tc-budget-card strong{font-size:12px}
.tc-budget-card small{font-size:10px;color:var(--tc-muted);margin-top:3px}
.tc-category-grid{display:grid;grid-template-columns:repeat(6,1fr);gap:12px}
.tc-category-card{display:block;padding:16px}
.tc-category-card .tc-category-icon{margin-bottom:12px}
.tc-category-card strong{font-size:13px}
.tc-category-card small{font-size:10px;color:var(--tc-muted);margin-top:4px}

/* Promise */
.tc-guide-banner{border-radius:20px;background:linear-gradient(135deg,#111827,#1d355f);color:#fff;padding:34px;display:grid;grid-template-columns:1fr 1fr;gap:35px}
.tc-guide-banner .tc-section-kicker{color:#8fb2ff}
.tc-guide-banner h2{font-size:29px;letter-spacing:-1px;margin:0}
.tc-guide-banner>div>p:last-child{color:#c9d1df;font-size:13px;line-height:1.6;max-width:560px}
.tc-guide-points{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;align-items:center}
.tc-guide-points>div{border-left:1px solid rgba(255,255,255,.14);padding-left:16px}
.tc-guide-points b{display:block;color:#ff7277;font-size:20px;margin-bottom:9px}
.tc-guide-points strong,.tc-guide-points small{display:block}
.tc-guide-points strong{font-size:12px}
.tc-guide-points small{font-size:10px;color:#b9c3d2;line-height:1.5;margin-top:4px}

/* Footer */
.tc-footer{margin-top:70px;background:#fbfcfe;border-top:1px solid #edf0f4;padding:48px 0 22px}
.tc-footer-grid{display:grid;grid-template-columns:2fr 1fr 1fr 1fr;gap:35px}
.tc-footer .tc-logo{color:var(--tc-text)}
.tc-footer h4{font-size:13px;margin:2px 0 14px}
.tc-footer p,.tc-footer a{font-size:11px;color:var(--tc-muted);line-height:1.7}
.tc-footer a{display:block;margin:7px 0}
.tc-copyright{border-top:1px solid #edf0f4;margin-top:35px;padding-top:17px;text-align:center;color:#98a2b3;font-size:10px}
.tc-empty{padding:30px;border:1px dashed #d7dde6;border-radius:14px;text-align:center;color:var(--tc-muted);font-size:13px}

/* Search filtering */
.tc-product-card.tc-hidden{display:none}

/* Responsive */
@media(max-width:1050px){
  .tc-tools{grid-template-columns:repeat(3,1fr)}
  .tc-tool-card:nth-child(4),.tc-tool-card:nth-child(5){display:none}
  .tc-product-grid{grid-template-columns:repeat(3,1fr)}
  .tc-deal-grid{grid-template-columns:repeat(3,1fr)}
  .tc-category-grid{grid-template-columns:repeat(3,1fr)}
}
@media(max-width:800px){
  .tc-container{width:min(100% - 28px,680px)}
  .tc-desktop-nav,.tc-signin{display:none}
  .tc-menu-btn{display:block}
  .tc-menu-btn.active{background:#3a4763}
  .tc-desktop-nav.mobile-open{position:absolute;left:14px;right:14px;top:70px;display:flex;flex-direction:column;align-items:stretch;gap:0;background:#111827;border:1px solid #29344b;border-radius:12px;padding:8px;box-shadow:0 18px 40px rgba(0,0,0,.25)}
  .tc-desktop-nav.mobile-open a{padding:13px;border-radius:8px}
  .tc-desktop-nav.mobile-open a:hover{background:#202b42}
  .tc-hero-grid{grid-template-columns:1fr}
  .tc-hero-copy{padding:52px 0 20px}
  .tc-hero h1{font-size:44px}
  .tc-hero-visual{min-height:270px;height:270px}
  .tc-device-one{right:48%;top:15px;width:105px;height:205px}
  .tc-device-two{right:22%;top:5px;width:110px;height:215px}
  .tc-device-three{right:0;bottom:5px;width:210px;height:125px}
  .tc-earbuds{right:58%;bottom:0;font-size:42px}
  .tc-watch{right:31%;bottom:0;font-size:40px}
  .tc-hero-note{left:0;top:25px;font-size:13px}
  .tc-tools{grid-template-columns:1fr 1fr}
  .tc-tool-card:nth-child(4),.tc-tool-card:nth-child(5){display:flex}
  .tc-product-grid{grid-template-columns:repeat(2,1fr)}
  .tc-deal-grid{grid-template-columns:repeat(2,1fr)}
  .tc-compare-card,.tc-guide-banner{grid-template-columns:1fr}
  .tc-budget-grid{grid-template-columns:repeat(2,1fr)}
  .tc-category-grid{grid-template-columns:repeat(2,1fr)}
  .tc-guide-points{grid-template-columns:1fr 1fr 1fr}
  .tc-footer-grid{grid-template-columns:1fr 1fr}
}
@media(max-width:480px){
  .tc-container{width:calc(100% - 24px)}
  .tc-header{height:68px}
  .tc-logo{font-size:18px}
  .tc-logo-mark{font-size:19px}
  .tc-trending-inner{height:42px;gap:16px;font-size:11px}
  .tc-trending-label{padding:6px 11px}
  .tc-hero-copy{padding-top:40px}
  .tc-hero h1{font-size:35px;letter-spacing:-2px}
  .tc-hero-sub{font-size:18px}
  .tc-hero-desc{font-size:13px}
  .tc-search{height:52px}
  .tc-search input{font-size:12px}
  .tc-search button{padding:12px 14px;font-size:11px}
  .tc-popular{overflow:auto;flex-wrap:nowrap;white-space:nowrap;padding-bottom:3px}
  .tc-tools{grid-template-columns:1fr}
  .tc-tool-card{min-height:auto}
  .tc-section{padding-top:46px}
  .tc-section-head h2{font-size:22px}
  .tc-section-head>div>p:last-child{font-size:11px}
  .tc-product-grid{grid-template-columns:1fr 1fr;gap:9px}
  .tc-phone-visual{height:145px}
  .tc-phone-visual:after{width:62px;height:112px;border-radius:15px}
  .tc-product-info{padding:11px}
  .tc-product-info h3{font-size:13px;min-height:34px}
  .tc-score-row{font-size:9px;margin:8px 0}
  .tc-price-line strong{font-size:13px}
  .tc-product-actions{flex-direction:column}
  .tc-details-btn,.tc-buy-btn{width:100%;padding:8px;font-size:10px}
  .tc-deal-grid{grid-template-columns:1fr 1fr;gap:9px}
  .tc-deal-image{height:120px}
  .tc-deal-body{padding:10px}
  .tc-deal-body h3{font-size:12px}
  .tc-deal-price{font-size:14px}
  .tc-compare-card{padding:22px}
  .tc-compare-ui{grid-template-columns:1fr}
  .tc-compare-ui>span{text-align:center}
  .tc-primary-btn,.tc-compare-note{grid-column:auto}
  .tc-primary-btn{width:100%}
  .tc-budget-grid,.tc-category-grid{grid-template-columns:1fr 1fr}
  .tc-guide-banner{padding:24px}
  .tc-guide-banner h2{font-size:23px}
  .tc-guide-points{grid-template-columns:1fr}
  .tc-guide-points>div{border-left:0;border-top:1px solid rgba(255,255,255,.14);padding:13px 0 0}
  .tc-footer-grid{grid-template-columns:1fr 1fr;gap:24px}
}
