*,*::before,*::after{box-sizing:border-box;margin:0;padding:0;}
:root{--red:#E8191A;--dark:#1a1a1a;--gray:#F5F3EF;--muted:#888;--border:#E0DDD8;}
html{scroll-behavior:smooth;}
body{font-family:'Segoe UI',system-ui,sans-serif;color:var(--dark);background:white;}
nav{position:sticky;top:0;z-index:100;background:white;border-bottom:1px solid var(--border);display:flex;align-items:center;justify-content:space-between;padding:12px 48px;}
.nav-logo{display:flex;align-items:center;gap:10px;text-decoration:none;}
.nav-mark{height:36px;width:36px;border-radius:10px;background:var(--red);color:white;font-weight:800;font-size:13px;display:flex;align-items:center;justify-content:center;flex-shrink:0;}
.nav-brand{font-size:17px;font-weight:800;letter-spacing:-0.5px;}
.nav-brand .r{color:var(--red);}.nav-brand .m{color:var(--dark);}
.nav-links{display:flex;gap:28px;align-items:center;}
.nav-links a{text-decoration:none;color:var(--muted);font-size:14px;}
.nav-links a:hover{color:var(--dark);}
.btn-nav{background:var(--red);color:white;border:none;padding:10px 22px;border-radius:8px;font-size:14px;font-weight:600;cursor:pointer;text-decoration:none;}

.hero{display:grid;grid-template-columns:1fr 1fr;min-height:92vh;align-items:center;padding:40px 48px 40px 64px;gap:16px;overflow:hidden;background:linear-gradient(135deg,#fff 55%,#FFF0F0 100%);}
.hero-tag{display:inline-block;background:#FFE8E8;color:var(--red);font-size:11px;font-weight:700;letter-spacing:1.5px;text-transform:uppercase;padding:5px 14px;border-radius:20px;margin-bottom:20px;}
.hero h1{font-size:52px;font-weight:800;line-height:1.08;letter-spacing:-2.5px;margin-bottom:16px;}
.hero h1 em{color:var(--red);font-style:normal;}
.hero-sub{font-size:16px;color:#666;line-height:1.75;margin-bottom:28px;max-width:440px;}
.btn-primary{background:var(--red);color:white;border:none;padding:14px 32px;border-radius:10px;font-size:16px;font-weight:700;cursor:pointer;text-decoration:none;display:inline-block;}
.hero-note{font-size:13px;color:var(--muted);}
.hero-actions{display:flex;gap:16px;align-items:center;flex-wrap:wrap;margin-bottom:32px;}
.hero-stats{display:flex;gap:24px;padding-top:24px;border-top:1px solid var(--border);}
.stat-num{font-size:24px;font-weight:800;color:var(--red);line-height:1;}
.stat-lbl{font-size:11px;color:var(--muted);margin-top:3px;}

.hero-right{display:flex;align-items:center;justify-content:center;}
.hero-collage{display:grid;grid-template-columns:repeat(5,1fr);gap:12px;max-width:620px;}
.hero-collage img{width:100%;aspect-ratio:3/4;object-fit:cover;border-radius:10px;box-shadow:0 6px 20px rgba(0,0,0,.22),0 2px 5px rgba(0,0,0,.1);}
.hero-collage div:nth-child(odd) img{transform:rotate(-2deg);}
.hero-collage div:nth-child(even) img{transform:rotate(2deg);}
.hero-collage div:nth-child(5n+2){margin-top:20px;}
.hero-collage div:nth-child(5n+3){margin-top:-10px;}
.hero-collage div:nth-child(5n+4){margin-top:14px;}
.hero-collage div:nth-child(5n){margin-top:-16px;}

.fridge-section{padding:80px 64px;background:var(--dark);}
.fridge-section .section-tag{color:var(--red);}
.fridge-sub{font-size:16px;color:#888;margin-bottom:40px;max-width:560px;}
.fridge-wrap{display:grid;grid-template-columns:1fr 1fr;gap:48px;align-items:center;}
.fridge-img-wrap{border-radius:20px;overflow:hidden;box-shadow:0 20px 60px rgba(0,0,0,.5);}
.fridge-img-wrap img{width:100%;display:block;}
.fridge-right{color:white;}
.fridge-right h3{font-size:24px;font-weight:800;margin-bottom:16px;line-height:1.3;}
.fridge-points{display:flex;flex-direction:column;gap:16px;}
.fp{display:flex;gap:14px;align-items:flex-start;}
.fp-icon{width:36px;height:36px;border-radius:50%;background:#2a2a2a;display:flex;align-items:center;justify-content:center;font-size:16px;flex-shrink:0;}
.fp-text h4{font-size:14px;font-weight:700;margin-bottom:3px;}
.fp-text p{font-size:13px;color:#888;line-height:1.5;}

.section{padding:80px 64px;}.section.gray{background:var(--gray);}
.section-tag{font-size:11px;font-weight:700;letter-spacing:2px;text-transform:uppercase;color:var(--red);margin-bottom:10px;}
.section-title{font-size:36px;font-weight:800;letter-spacing:-1px;margin-bottom:44px;}

.steps{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;}
.step{background:white;border-radius:16px;padding:26px 22px;border:1px solid var(--border);position:relative;}
.step-num{width:38px;height:38px;border-radius:50%;background:#FFE8E8;color:var(--red);font-size:17px;font-weight:800;display:flex;align-items:center;justify-content:center;margin-bottom:14px;}
.step h3{font-size:15px;font-weight:700;margin-bottom:7px;}
.step p{font-size:13px;color:#666;line-height:1.6;}
.step-arrow{position:absolute;right:-13px;top:44px;font-size:20px;color:#D0CCC7;z-index:2;}

.works-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:24px;}
.work-item{display:flex;flex-direction:column;align-items:center;gap:8px;}
.work-item img{width:100%;aspect-ratio:3/4;object-fit:cover;border-radius:10px;box-shadow:0 4px 14px rgba(0,0,0,.15);}
.work-cat{font-size:11px;font-weight:600;color:var(--muted);text-transform:uppercase;letter-spacing:.5px;}

.price-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;max-width:640px;}
.price-card{background:white;border-radius:16px;border:1px solid var(--border);padding:28px 22px;text-align:center;}
.price-card.best{border:2px solid var(--red);position:relative;}
.best-label{position:absolute;top:-12px;left:50%;transform:translateX(-50%);background:var(--red);color:white;font-size:11px;font-weight:600;padding:3px 14px;border-radius:20px;white-space:nowrap;}
.price-qty{font-size:30px;font-weight:800;}
.price-card.best .price-qty{color:var(--red);}
.price-unit{font-size:12px;color:var(--muted);margin:4px 0 10px;}
.price-val{font-size:22px;font-weight:700;}
.price-total{font-size:12px;color:var(--muted);margin-top:5px;}

.order-grid{display:grid;grid-template-columns:1fr 1fr;gap:64px;align-items:start;}
.order-info h3{font-size:26px;font-weight:800;letter-spacing:-.5px;margin-bottom:14px;}
.order-info p{font-size:15px;color:#666;line-height:1.7;margin-bottom:24px;}
.info-list{list-style:none;display:flex;flex-direction:column;gap:14px;}
.info-list li{display:flex;gap:12px;align-items:flex-start;font-size:14px;color:#555;line-height:1.5;}
.info-icon{width:32px;height:32px;border-radius:50%;background:#FFE8E8;color:var(--red);font-weight:700;font-size:12px;display:flex;align-items:center;justify-content:center;flex-shrink:0;margin-top:1px;}

.order-form{background:var(--gray);border-radius:20px;padding:32px;}
.form-label{font-size:12px;font-weight:600;color:var(--muted);text-transform:uppercase;letter-spacing:.5px;margin-bottom:8px;display:block;}
.form-row{margin-bottom:18px;}
.status-box{max-width:420px;margin:0 auto;}
.status-box .btn-order{width:auto;padding:12px 24px;white-space:nowrap;}
.form-row-split{display:flex;gap:10px;}
.form-input{width:100%;padding:12px 14px;border-radius:10px;border:1px solid var(--border);font-size:14px;background:white;color:var(--dark);outline:none;}
.form-input:focus{border-color:var(--red);}
.qty-btns{display:flex;gap:8px;flex-wrap:wrap;}
.qty-btn{padding:9px 16px;border-radius:8px;border:1px solid var(--border);background:white;font-size:14px;cursor:pointer;font-weight:600;color:#555;}
.qty-btn.on{background:var(--red);color:white;border-color:var(--red);}
.delivery-btns{display:flex;gap:8px;}
.delivery-btns .qty-btn{flex:1;}
.upload-zone{border:2px dashed var(--border);border-radius:12px;padding:24px;text-align:center;background:white;cursor:pointer;margin-bottom:16px;}
.upload-zone:hover{border-color:var(--red);}
.upload-zone p{font-size:13px;color:var(--muted);margin-top:6px;line-height:1.5;}
.upload-zone strong{color:var(--dark);}
.photos-list{display:flex;flex-direction:column;gap:12px;margin-bottom:16px;}
.photo-card{background:white;border-radius:12px;border:1px solid var(--border);padding:12px;display:flex;gap:12px;align-items:center;}
.photo-thumb{flex-shrink:0;border-radius:8px;overflow:hidden;box-shadow:0 3px 10px rgba(0,0,0,.18);transition:all .3s;}
.photo-thumb img{width:100%;height:100%;object-fit:cover;display:block;}
.photo-info{flex:1;min-width:0;}
.photo-name{font-size:13px;font-weight:600;color:var(--dark);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-bottom:8px;}
.orient-toggle{display:flex;gap:6px;}
.orient-btn{flex:1;padding:7px 6px;border-radius:7px;border:1px solid var(--border);background:white;font-size:12px;cursor:pointer;text-align:center;color:#666;line-height:1.3;}
.orient-btn.on{background:#FFE8E8;color:var(--red);border-color:var(--red);font-weight:600;}
.photo-remove{background:none;border:none;color:#bbb;font-size:20px;cursor:pointer;padding:4px;flex-shrink:0;line-height:1;}
.photo-remove:hover{color:var(--red);}
.total-row{display:flex;justify-content:space-between;align-items:center;padding:16px 0;border-top:1px solid var(--border);margin-top:4px;}
.total-lbl{font-size:14px;color:var(--muted);}
.total-val{font-size:26px;font-weight:800;}
.total-warn{font-size:11px;color:var(--red);margin-top:3px;}
.btn-order{width:100%;background:var(--red);color:white;border:none;padding:15px;border-radius:12px;font-size:16px;font-weight:700;cursor:pointer;margin-top:10px;}
.btn-order:hover{background:#c81516;}
.btn-order:disabled{background:#ccc;cursor:not-allowed;}
.error-line{color:var(--red);font-size:13px;margin-top:10px;min-height:18px;}

.pickup-section{padding:80px 64px;background:#1a1a1a;color:white;}
.pickup-section .section-tag{color:var(--red);}
.pickup-section .section-title{color:white;margin-bottom:36px;}
.pickup-grid{max-width:560px;}
.pickup-address-card{background:#242424;border-radius:16px;padding:32px;border:1px solid #333;margin-bottom:16px;}
.pickup-address-card h3{font-size:20px;font-weight:800;margin-bottom:4px;color:white;}
.addr{font-size:24px;font-weight:800;color:white;line-height:1.3;margin:10px 0 20px;}
.addr span{color:var(--red);}
.pd-row{display:flex;gap:12px;align-items:center;font-size:14px;color:#999;margin-bottom:10px;}
.pd-icon{width:30px;height:30px;border-radius:50%;background:#333;display:flex;align-items:center;justify-content:center;font-size:14px;flex-shrink:0;}
.pickup-timings{display:flex;gap:12px;}
.timing-card{background:#242424;border-radius:12px;padding:16px 20px;border:1px solid #333;flex:1;}
.timing-val{font-size:19px;font-weight:700;color:white;}
.timing-lbl{font-size:12px;color:#777;margin-top:3px;}

footer{background:#111;color:#555;padding:24px 64px;display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:12px;}
footer .nav-mark{height:28px;width:28px;font-size:11px;}
footer p{font-size:13px;}
footer a{color:var(--red);text-decoration:none;font-size:13px;}

@media(max-width:900px){
  nav{padding:12px 16px;}.nav-links{display:none;}
  .hero{grid-template-columns:1fr;padding:36px 20px;min-height:auto;}
  .hero h1{font-size:34px;}
  .hero-right{margin-top:20px;}
  .hero-collage{max-width:100%;grid-template-columns:repeat(3,1fr);}
  .section,.fridge-section,.pickup-section{padding:48px 20px;}
  .steps{grid-template-columns:1fr 1fr;}.step-arrow{display:none;}
  .works-grid{grid-template-columns:repeat(2,1fr);}
  .price-grid{grid-template-columns:1fr;max-width:300px;}
  .order-grid,.fridge-wrap{grid-template-columns:1fr;gap:28px;}
  .form-row-split{flex-direction:column;}
  footer{padding:20px 16px;}
}
