*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;font-family:Arial,Helvetica,sans-serif;color:#111;background:#f7f6f3}a{text-decoration:none;color:inherit}button,input,select,textarea{font:inherit}.top{height:38px;background:#111;color:#eee;display:flex;align-items:center;justify-content:center;gap:18px;font-size:12px}.top i{color:#b8945d}.logo{font-size:29px;font-weight:900;letter-spacing:-1.5px}.logo span{color:#c7a46b}header{height:76px;background:#fff;border-bottom:1px solid #eee;display:flex;align-items:center;padding:0 6%;position:sticky;top:0;z-index:20}nav{display:flex;gap:32px;margin:auto;font-size:14px}nav a:hover{color:#b18b52}.actions{display:flex;gap:12px}.actions button{background:none;border:0;cursor:pointer;font-size:24px}.actions .cart{font-size:13px;border:1px solid #ddd;border-radius:30px;padding:10px 15px}.cart b{background:#111;color:#fff;border-radius:50%;padding:2px 6px;font-size:10px}.hero{min-height:540px;background:radial-gradient(circle at 75% 40%,#373737,#0c0c0c 58%);color:#fff;display:flex;align-items:center;padding:65px 7%;overflow:hidden}.copy{width:49%}.copy small,.section small,.promo small,.newsletter small,.why>div>small,.modalCard>small{letter-spacing:3px;color:#c29a5d;font-weight:bold;font-size:12px}.copy h1{font-size:72px;line-height:.94;letter-spacing:-4px;margin:16px 0}.copy h1 em{font-style:normal;color:#e2bd87}.copy p{color:#bbb;font-size:18px;line-height:1.6;max-width:500px}.copy>div{display:flex;gap:14px;margin:27px 0}.copy label{font-size:13px;color:#bbb}.btn{display:inline-flex;align-items:center;justify-content:center;padding:14px 24px;border-radius:10px;border:1px solid transparent;font-weight:bold;cursor:pointer}.gold{background:#e3bb7f;color:#111}.outline{border-color:#777;color:#fff}.light{background:#fff;color:#111}.dark{background:#111;color:#fff}.cases{width:51%;height:400px;display:flex;align-items:center;justify-content:center}.case{height:325px;width:175px;border-radius:34px;display:flex;align-items:flex-end;justify-content:center;padding-bottom:40px;font-size:9px;letter-spacing:4px;box-shadow:0 30px 55px #0009;border:1px solid #555}.black{background:linear-gradient(145deg,#292929,#070707);transform:rotate(-8deg);z-index:2}.cream{background:linear-gradient(145deg,#eee5d7,#b9aa95);transform:translateX(-28px) rotate(4deg);z-index:3}.clear{background:#ffffff16;backdrop-filter:blur(3px);transform:translateX(-55px) rotate(10deg);z-index:4}.clear span{position:absolute;top:75px;width:72px;height:72px;border:9px solid #aaa;border-radius:50%}.benefits{background:#fff;display:grid;grid-template-columns:repeat(4,1fr);padding:25px 7%;border-bottom:1px solid #eee}.benefits div{padding:0 22px;border-right:1px solid #ddd}.benefits div:first-child{padding-left:0}.benefits div:last-child{border:0}.benefits b,.benefits small{display:block;margin-left:26px}.benefits b{font-size:14px}.benefits small{color:#777;margin-top:4px;font-size:12px}.section{padding:75px 6.5%}.head{display:flex;justify-content:space-between;align-items:end;margin-bottom:28px}.head h2,.why h2,.newsletter h2{font-size:38px;letter-spacing:-1.8px;margin:8px 0 0}.head>a{background:#fff;border:1px solid #ddd;border-radius:30px;padding:11px 17px;font-size:13px}.models{display:grid;grid-template-columns:repeat(6,1fr);gap:12px}.model{background:#fff;border:1px solid #eee;border-radius:14px;padding:15px;text-align:center;cursor:pointer}.model:hover{border-color:#c5a06a;transform:translateY(-2px)}.phone{height:120px;width:58px;margin:0 auto 13px;border-radius:14px;background:linear-gradient(145deg,#222,#050505);position:relative}.phone:after{content:"";position:absolute;top:9px;left:9px;width:24px;height:24px;border-radius:7px;background:#111;box-shadow:9px 0 #333,0 9px #444}.promo{margin:0 6.5%;border-radius:24px;background:#111;color:#fff;min-height:300px;padding:50px 6%;display:flex;justify-content:space-between;align-items:center;overflow:hidden}.promo h2{font-size:48px;line-height:.95;margin:15px 0}.promo p{color:#aaa}.promoPhone{width:240px;height:275px;border-radius:40px;background:linear-gradient(145deg,#333,#090909);transform:rotate(17deg);margin-right:9%}.tools{display:flex;gap:10px}.tools input,.tools select{border:1px solid #ddd;border-radius:30px;padding:11px 15px;background:#fff;outline:none}.products{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}.product{background:#fff;border:1px solid #eee;border-radius:17px;padding:12px}.art{height:260px;border-radius:13px;background:#f0eee9;display:flex;align-items:center;justify-content:center;position:relative}.tag{position:absolute;left:10px;top:10px;background:#b18b52;color:#fff;padding:5px 9px;border-radius:20px;font-size:10px}.pcase{width:105px;height:190px;border-radius:23px;box-shadow:0 20px 25px #0002;position:relative}.pcase:after{content:"";position:absolute;top:18px;left:13px;width:30px;height:30px;border-radius:8px;background:#111;box-shadow:12px 0 #333,0 12px #555}.product h3{font-size:15px;margin:14px 3px 5px}.meta{font-size:12px;color:#888;margin:0 3px}.price{display:flex;align-items:center;justify-content:space-between;margin:14px 3px 3px}.add{background:#111;color:#fff;border:0;border-radius:9px;padding:10px 13px;cursor:pointer}.why{display:grid;grid-template-columns:.8fr 1.2fr;gap:80px;background:#efede8}.why>div>p{color:#666;line-height:1.7;max-width:440px}.whygrid{display:grid;grid-template-columns:1fr 1fr;gap:30px}.whygrid article{border-top:1px solid #c9c5bc;padding-top:14px}.whygrid article>b{color:#b18b52;font-size:12px}.whygrid h3{margin:8px 0}.whygrid p{color:#666;font-size:14px;line-height:1.5}.newsletter{text-align:center;background:#fff;padding:85px 20px}.newsletter p{color:#777}.newsletter a{display:inline-block;border:1px solid #ddd;padding:11px 18px;border-radius:30px;margin:10px 4px}.newsletter a:hover{background:#111;color:#fff}footer{background:#111;color:#eee;display:grid;grid-template-columns:2fr 1fr 1fr 1fr;gap:45px;padding:55px 7%;font-size:13px}footer .logo{color:#fff}footer p,footer a:not(.logo){color:#aaa}footer b{display:block;margin-bottom:15px}footer a:not(.logo){display:block;margin:9px 0}.overlay{display:none;position:fixed;inset:0;background:#0008;z-index:40}.overlay.open{display:block}.drawer{position:fixed;right:-420px;top:0;width:400px;max-width:90vw;height:100vh;background:#fff;z-index:50;padding:25px;transition:.3s;box-shadow:-15px 0 50px #0002}.drawer.open{right:0}.drawerHead{display:flex;justify-content:space-between}.drawerHead button,.x{border:0;background:none;font-size:28px;cursor:pointer}.row{display:flex;gap:12px;border-bottom:1px solid #eee;padding:15px 0}.thumb{width:55px;height:70px;border-radius:10px}.total{display:flex;justify-content:space-between;font-size:18px;margin:25px 0}.full{width:100%}.modal{display:none;position:fixed;inset:0;background:#0008;z-index:60;align-items:center;justify-content:center;padding:20px}.modal.open{display:flex}.modalCard{background:#fff;border-radius:20px;padding:30px;width:100%;max-width:500px;position:relative}.modalCard h2{margin:8px 0 20px}.modalCard form{display:grid;gap:12px}.modalCard input,.modalCard textarea,.modalCard select{padding:14px;border:1px solid #ddd;border-radius:10px;resize:vertical}.note{background:#f4efe6;padding:12px;border-radius:10px;color:#66553d;font-size:12px;line-height:1.5}.wa{position:fixed;right:22px;bottom:22px;background:#1e9d54;color:#fff;padding:13px 18px;border-radius:30px;z-index:30;font-weight:bold;font-size:13px}@media(max-width:900px){nav{display:none}.hero{padding:55px 6%}.copy{width:100%}.cases{display:none}.copy h1{font-size:55px}.benefits{grid-template-columns:1fr 1fr;gap:20px}.benefits div{border:0;padding:0}.models{grid-template-columns:repeat(3,1fr)}.products{grid-template-columns:repeat(2,1fr)}.why{grid-template-columns:1fr;gap:35px}.promoPhone{margin-right:0}footer{grid-template-columns:1fr 1fr}}@media(max-width:560px){.top{font-size:9px;gap:7px}.header{height:65px;padding:0 5%}.logo{font-size:24px}.copy h1{font-size:48px}.copy p{font-size:15px}.copy>div{flex-wrap:wrap}.benefits{grid-template-columns:1fr;padding:25px 6%}.section{padding:55px 5%}.head{display:block}.head>a{display:inline-block;margin-top:15px}.models{grid-template-columns:repeat(2,1fr)}.promo{margin:0 5%;padding:35px 28px}.promo h2{font-size:40px}.promoPhone{width:130px;height:180px}.products{gap:10px}.art{height:190px}.pcase{height:140px;width:78px}.whygrid{grid-template-columns:1fr}footer{grid-template-columns:1fr;padding:45px 7%}}
.hero3d{width:51%;height:410px;position:relative;perspective:1100px;display:flex;align-items:center;justify-content:center}.ring{position:absolute;width:440px;height:120px;border:2px solid #cda96d88;border-radius:50%;bottom:28px;transform:rotateX(66deg);box-shadow:0 0 30px #cda96d22}.case3d{position:absolute;width:145px;height:285px;border-radius:32px;display:flex;align-items:flex-end;justify-content:center;padding-bottom:35px;font-size:9px;letter-spacing:4px;border:1px solid #777;box-shadow:0 30px 55px #000b;animation:float3d 4.5s ease-in-out infinite;transform-style:preserve-3d}.case3d:before{content:"";position:absolute;top:22px;left:18px;width:44px;height:50px;border-radius:11px;background:#111;box-shadow:13px 0 #333,0 13px #555}.one{background:linear-gradient(145deg,#eee3d2,#a99883);transform:translate(-175px,20px) rotateY(18deg) rotateZ(-8deg);animation-delay:-1s}.two{background:linear-gradient(145deg,#333,#080808);transform:translate(-82px,-8px) rotateY(8deg) rotateZ(-4deg);z-index:3;animation-delay:-2s}.three{background:#ffffff20;backdrop-filter:blur(4px);transform:translate(15px,-32px) rotateY(-2deg);z-index:5;animation-delay:-3s}.three span{position:absolute;top:85px;width:66px;height:66px;border:8px solid #aaa;border-radius:50%}.four{background:linear-gradient(145deg,#627866,#213527);transform:translate(108px,0) rotateY(-12deg) rotateZ(5deg);z-index:2;animation-delay:-4s}.five{background:linear-gradient(145deg,#34516f,#081523);transform:translate(185px,25px) rotateY(-18deg) rotateZ(9deg);z-index:1;animation-delay:-.5s}.badge3d{position:absolute;right:0;bottom:48px;width:82px;height:82px;border-radius:50%;border:1px solid #cda96d88;background:#111d;display:flex;flex-direction:column;align-items:center;justify-content:center;z-index:10}.badge3d b{color:#e4bd82;font-size:17px}.badge3d small{font-size:7px;letter-spacing:1px;color:#bbb}@keyframes float3d{0%,100%{margin-top:0}50%{margin-top:-18px}}.models{grid-template-columns:repeat(8,1fr)}.phone-11{background:linear-gradient(145deg,#111,#000)}.phone-12{background:linear-gradient(145deg,#64758b,#263647)}.phone-13{background:linear-gradient(145deg,#647b67,#263b2a)}.phone-14{background:linear-gradient(145deg,#46395f,#171022)}.phone-15{background:linear-gradient(145deg,#ddd,#999)}.phone-16{background:linear-gradient(145deg,#252525,#080808)}.phone-17{background:linear-gradient(145deg,#a96d48,#35180c)}.phone-18{background:linear-gradient(145deg,#42698f,#0b1c31)}.form2{display:grid;grid-template-columns:1fr 1fr;gap:10px}.modalCard form{display:grid;gap:10px}.modalCard input,.modalCard select{padding:13px;border:1px solid #ddd;border-radius:9px}.note{background:#f5efe4;padding:12px;border-radius:9px;font-size:12px;color:#66553d;line-height:1.45}@media(max-width:900px){.hero3d{display:none}.models{grid-template-columns:repeat(4,1fr)}}@media(max-width:560px){.models{grid-template-columns:repeat(2,1fr)}.form2{grid-template-columns:1fr}}
/* CASELY V3 premium polish */
.sectionSub{color:#777;margin:8px 0 0;font-size:14px}
.modelSection{background:linear-gradient(180deg,#faf9f6,#f4f2ed)}
.modelSearch{max-width:520px;margin:0 auto 28px;background:#fff;border:1px solid #dedbd4;border-radius:999px;padding:12px 18px;display:flex;align-items:center;gap:10px;box-shadow:0 8px 25px #00000008}
.modelSearch span{font-size:22px;color:#8f8b83}
.modelSearch input{border:0;outline:0;width:100%;background:transparent;font-size:14px}
.models{display:grid!important;grid-template-columns:repeat(6,minmax(0,1fr));gap:12px}
.model{border:1px solid #e5e1d9!important;background:#fff!important;border-radius:16px!important;padding:16px 10px!important;min-height:165px;cursor:pointer;transition:.25s!important;display:flex;flex-direction:column;align-items:center;justify-content:flex-start}
.model:hover{transform:translateY(-5px)!important;border-color:#c4a36d!important;box-shadow:0 15px 35px #00000010}
.modelName{font-weight:750;font-size:13px;margin-top:5px}
.model small{color:#9a968d;margin-top:5px;font-size:11px}
.phone{height:88px;width:48px;border-radius:13px;background:linear-gradient(145deg,#252525,#080808);position:relative;margin-bottom:8px;box-shadow:0 10px 18px #0002}
.phone:after{content:"";position:absolute;width:19px;height:22px;top:7px;left:7px;border-radius:6px;background:#111;box-shadow:9px 0 #333,0 9px #555}
.model:has(.phone-11-Pro),.model:has(.phone-11-Pro-Max){background:#fdfdfd!important}
.phone-iPhone-11-Pro{background:linear-gradient(145deg,#383838,#080808)}
.phone-iPhone-11-Pro-Max{background:linear-gradient(145deg,#202020,#000)}
.phone-iPhone-12-mini{background:linear-gradient(145deg,#607489,#263647)}
.phone-iPhone-12-Pro{background:linear-gradient(145deg,#c5c5c5,#6f6f6f)}
.phone-iPhone-12-Pro-Max{background:linear-gradient(145deg,#b6a68f,#5c5041)}
.phone-iPhone-13-mini{background:linear-gradient(145deg,#6b7c90,#263748)}
.phone-iPhone-13-Pro{background:linear-gradient(145deg,#7e847f,#272a28)}
.phone-iPhone-13-Pro-Max{background:linear-gradient(145deg,#697d75,#243a33)}
.phone-iPhone-14-Plus{background:linear-gradient(145deg,#a1a1a1,#333)}
.phone-iPhone-14-Pro{background:linear-gradient(145deg,#6c6578,#201b2b)}
.phone-iPhone-14-Pro-Max{background:linear-gradient(145deg,#5d566c,#17131f)}
.phone-iPhone-15-Plus{background:linear-gradient(145deg,#c9a4a5,#6f4f52)}
.phone-iPhone-15-Pro{background:linear-gradient(145deg,#7e8587,#33383a)}
.phone-iPhone-15-Pro-Max{background:linear-gradient(145deg,#a08d79,#4c4034)}
.phone-iPhone-16e{background:linear-gradient(145deg,#444,#111)}
.phone-iPhone-16-Plus{background:linear-gradient(145deg,#8e9b8d,#384438)}
.phone-iPhone-16-Pro{background:linear-gradient(145deg,#a99f90,#4e473e)}
.phone-iPhone-16-Pro-Max{background:linear-gradient(145deg,#8f8a83,#3c3935)}
.phone-iPhone-17-Air{background:linear-gradient(145deg,#a7b5c1,#43515d)}
.phone-iPhone-17-Pro{background:linear-gradient(145deg,#a96d48,#35180c)}
.phone-iPhone-17-Pro-Max{background:linear-gradient(145deg,#6e5446,#241711)}
.phone-iPhone-18-Pro{background:linear-gradient(145deg,#8d7f73,#302822)}
.phone-iPhone-18-Pro-Max{background:linear-gradient(145deg,#5f5f63,#17181a)}
.hero3d{transform:rotateX(var(--my,0deg)) rotateY(var(--mx,0deg));transition:transform .18s ease-out}
.case3d{filter:drop-shadow(0 25px 28px #0008)}
.checkoutSteps{display:flex;gap:7px;margin:0 0 18px;overflow:auto;padding-bottom:3px}
.checkoutSteps span{white-space:nowrap;font-size:10px;border:1px solid #ddd;padding:6px 9px;border-radius:999px;color:#999}
.checkoutSteps .active{background:#111;color:#fff;border-color:#111}
@media(max-width:1100px){.models{grid-template-columns:repeat(4,minmax(0,1fr))}}
@media(max-width:650px){.models{grid-template-columns:repeat(2,minmax(0,1fr))}.model{min-height:145px}.phone{height:75px;width:43px}}

.brand-credit{position:absolute;left:50%;transform:translateX(-50%);text-align:center;line-height:1.05;pointer-events:none}.brand-credit span{display:block;font-size:7px;letter-spacing:2px;color:#9b9b9b;margin-bottom:3px}.brand-credit strong{font-size:11px;letter-spacing:.4px;color:#333}.footer-credit{grid-column:1/-1;border-top:1px solid #292929;padding-top:20px;margin-top:10px;display:flex;justify-content:space-between;align-items:center}.footer-credit span{font-weight:900;letter-spacing:1px}.footer-credit p{margin:0;font-size:12px;color:#999}.footer-credit strong{color:#ddd}@media(max-width:900px){.brand-credit{display:none}.footer-credit{display:block}.footer-credit p{margin-top:7px}}
/* CASELY multi-design catalog */
.categoryBar{display:flex;gap:10px;flex-wrap:wrap;margin:0 0 28px;padding:5px 0}
.catChip{appearance:none;border:1px solid #ded9cf;background:#fff;border-radius:14px;padding:11px 15px;cursor:pointer;display:flex;flex-direction:column;text-align:left;min-width:125px;transition:.2s}
.catChip strong{font-size:13px;color:#222}.catChip small{font-size:10px;color:#8a867e;margin-top:3px}.catChip:hover,.catChip.active{background:#111;border-color:#111;color:#fff;transform:translateY(-2px)}.catChip.active strong,.catChip.active small{color:#fff}
.categoryLabel{display:inline-block;font-size:9px;letter-spacing:.8px;text-transform:uppercase;color:#9a7442;background:#f4ecdf;padding:5px 8px;border-radius:999px;margin-top:10px}
.product h3{margin-top:8px}.emptyCases{grid-column:1/-1;padding:35px 0;color:#777}
.pcase{position:relative;overflow:hidden}.caseCamera{position:absolute;top:16px;left:13px;width:31px;height:36px;border-radius:9px;background:#111;box-shadow:10px 0 #333,0 10px #555}.caseBrand{position:absolute;bottom:14px;left:0;right:0;text-align:center;font-size:7px;letter-spacing:2px;color:#ffffff99}
@media(max-width:900px){.categoryBar{gap:7px}.catChip{min-width:calc(33.333% - 7px)}}
@media(max-width:560px){.categoryBar{display:grid;grid-template-columns:1fr 1fr}.catChip{min-width:0}.shopHead .tools{margin-top:15px}}

/* Homepage featured 17/18 collection */
.featured{background:#fff;padding-top:58px;padding-bottom:58px}.featuredGrid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}.featuredCard{background:#f5f3ef;border:1px solid #e8e3da;border-radius:20px;overflow:hidden;transition:.25s;box-shadow:0 10px 30px #00000008}.featuredCard:hover{transform:translateY(-6px);box-shadow:0 20px 40px #00000012}.featuredArt{height:300px;position:relative;display:flex;align-items:center;justify-content:center;overflow:hidden;background:radial-gradient(circle at 50% 45%,#fff,#ebe8e1)}.featuredCard.darkCase .featuredArt{background:radial-gradient(circle at 50% 45%,#3b3b3b,#111)}.featuredCard.greenCase .featuredArt{background:radial-gradient(circle at 50% 45%,#53675b,#17231b)}.featuredCard.carbonCase .featuredArt{background:radial-gradient(circle at 50% 45%,#3c4246,#0b0c0d)}.featuredTag{position:absolute;top:14px;left:14px;background:#b18b52;color:#fff;border-radius:999px;padding:6px 10px;font-size:9px;letter-spacing:1px;font-weight:700;z-index:2}.featuredPhone{width:132px;height:238px;border-radius:31px;position:relative;box-shadow:0 28px 40px #0007;transform:rotate(-5deg);border:1px solid #ffffff30;background:linear-gradient(145deg,#303030,#050505)}.sandCase .featuredPhone{background:linear-gradient(145deg,#eee0cc,#a98f70)}.greenCase .featuredPhone{background:linear-gradient(145deg,#657e69,#17271d)}.carbonCase .featuredPhone{background:linear-gradient(145deg,#454b50,#08090a)}.featuredCamera{position:absolute;top:18px;left:17px;width:43px;height:50px;border-radius:12px;background:#101010;box-shadow:13px 0 #303030,0 13px #4b4b4b}.featuredLogo{position:absolute;bottom:22px;left:0;right:0;text-align:center;font-size:8px;letter-spacing:3px;color:#ffffffaa}.featuredInfo{padding:17px 17px 19px;background:#fff}.featuredInfo>span{font-size:10px;color:#8d877d;letter-spacing:1px;text-transform:uppercase}.featuredInfo h3{margin:7px 0 13px;font-size:18px}.featuredInfo button{border:0;background:none;padding:0;font-size:12px;font-weight:700;cursor:pointer;color:#9a7442}.featuredInfo button:hover{color:#111}@media(max-width:1000px){.featuredGrid{grid-template-columns:repeat(2,1fr)}}@media(max-width:560px){.featured{padding-top:45px;padding-bottom:45px}.featuredGrid{grid-template-columns:1fr 1fr;gap:10px}.featuredArt{height:220px}.featuredPhone{width:96px;height:174px;border-radius:23px}.featuredCamera{top:13px;left:12px;width:32px;height:37px}.featuredLogo{bottom:15px;font-size:6px}.featuredInfo{padding:13px}.featuredInfo h3{font-size:14px}.featuredInfo>span{font-size:8px}.featuredInfo button{font-size:10px}}
