html{
font-size:16px;
-webkit-text-size-adjust:100%;
text-size-adjust:100%;
}

*{
box-sizing:border-box;
}

body{
margin:0;
font-family:Segoe UI,Arial,sans-serif;
background:#f4fbff;
color:#0b1620;
overflow-x:hidden;
}

/* HERO */

.hero{
height:250px;
display:flex;
align-items:center;
padding:12px 7% 6px;

background:
linear-gradient(
rgba(7,18,28,.59),
rgba(7,18,28,.10)
),
url('images/hero.png');

background-size:cover;
background-position:center top;
background-repeat:no-repeat;
}

.hero-inner{
max-width:900px;
}

.mini{
letter-spacing:4px;
font-weight:700;
font-size:15px;
color:#7dd3fc;
margin-bottom:20px;
text-transform:uppercase;
}

.hero h1{
font-size:46px;
line-height:.92;
margin:0 0 14px;
color:white;
text-shadow:
0 10px 30px rgba(0,0,0,.38);
}

.hero p{
font-size:16px;
line-height:1.45;
max-width:760px;
color:#d8e7f1;
text-shadow:
0 3px 14px rgba(0,0,0,.28);
}

/* CATALOG */

.catalog{
padding:28px 5% 70px;
background:white;
margin-top:0;
}

.catalog h2{
font-size:46px;
margin:0 0 50px;
}

/* GRID */

.grid{
display:grid;
grid-template-columns:repeat(auto-fit,minmax(340px,1fr));
gap:26px;
}

/* CARD */

.card{
display:block;
text-decoration:none;
background:white;
border-radius:36px;
overflow:hidden;
box-shadow:0 25px 60px rgba(0,0,0,.08);
transition:.35s;
color:#0b1620;
}

.card:hover{
transform:translateY(-10px);
box-shadow:0 35px 80px rgba(0,0,0,.12);
}

/* IMAGE SYSTEM */

.card-image-wrap{
aspect-ratio:1/1;
padding:34px;
display:flex;
align-items:center;
justify-content:center;
background:
linear-gradient(180deg,#f8fcff,#edf7fd);
overflow:hidden;
}

.card-image-wrap img{
width:100%;
height:100%;
object-fit:contain;
display:block;
}

.card-content{
padding:30px;
}

.card-content h3{
font-size:27px;
margin:0 0 12px;
}

.card-content p{
font-size:17px;
line-height:1.7;
color:#5a6f7e;
min-height:60px;
}

.price{
margin-top:24px;
font-size:27px;
font-weight:800;
}

/* PRODUCT PAGE */

.product-layout{
display:grid;
grid-template-columns:1fr 1fr;
min-height:100vh;
}

.left-side{
display:flex;
align-items:flex-start;
justify-content:center;
padding:40px 70px 70px;
background:
linear-gradient(180deg,#f6fbff,#eef8fd);
}

.left-side img{
width:100%;
max-width:720px;
height:auto;
object-fit:contain;
display:block;
border-radius:40px;
}

.right-side{
padding:90px;
background:white;
}

.tag{
display:inline-block;
padding:10px 18px;
border-radius:999px;
background:#e8f6ff;
color:#008cff;
font-weight:700;
margin-bottom:30px;
}

.right-side h1{
font-size:58px;
line-height:.92;
margin:0 0 20px;
}

.price-big{
font-size:40px;
font-weight:800;
margin-bottom:30px;
}

.desc{
font-size:20px;
line-height:1.9;
color:#5c6f7d;
}

/* FORM */

.form-box{
margin-top:60px;
padding:40px;
border-radius:32px;
background:#f4fbff;
}

form{
display:flex;
flex-direction:column;
gap:18px;
}

input,
textarea,
button{
padding:18px;
border:none;
border-radius:18px;
font-size:16px;
}

textarea{
min-height:140px;
resize:vertical;
}

button{
background:#08131d;
color:white;
font-weight:700;
cursor:pointer;
}

/* THEMES */

.cyan-theme{background:#ecfbff;}
.emerald-theme{background:#f1fff8;}
.violet-theme{background:#f7f2ff;}
.amber-theme{background:#fff7eb;}
.silver-theme{background:#f3f6f9;}
.obsidian-theme{background:#111827;color:white;}
.rose-theme{background:#fff1f4;}
.ice-theme{background:#edf9ff;}

/* MOBILE */

@media(max-width:1000px){

.hero{
height:240px;
padding:14px 6%;
}

.hero h1{
font-size:40px;
}

.hero p{
font-size:14px;
}

.product-layout{
grid-template-columns:1fr;
}

.right-side{
padding:50px 30px;
}

.right-side h1{
font-size:52px;
}

.catalog h2{
font-size:42px;
}

}


/* BILINGUAL TEXT SUPPORT */

.bilingual-desc{
white-space:pre-line;
}

/* FORM IMPROVEMENTS */

.form-box h2{
line-height:1.4;
}

input::placeholder,
textarea::placeholder{
line-height:1.4;
}