*{box-sizing:border-box}:root{--ink:#29243d;--muted:#716c82;--violet:#7458f5;--pink:#ff6bad;--line:#ebe8f5}body{margin:0;font-family:Arial,sans-serif;color:var(--ink);background:radial-gradient(circle at 8% 2%,#efe9ff,transparent 28rem),radial-gradient(circle at 94% 8%,#ffe4f0,transparent 26rem),#fff}header{height:76px;display:flex;align-items:center;justify-content:space-between;padding:0 5%;background:#fffffff2;border-bottom:1px solid var(--line);position:sticky;top:0;z-index:20}.logo{text-decoration:none;font-size:28px;font-weight:900}.logo b,.eyebrow{color:var(--violet)}nav a{margin-left:10px;padding:11px 14px;border-radius:14px;text-decoration:none;font-weight:800}nav a:hover{background:#f1edff}main{max-width:1420px;margin:auto;padding:0 5% 70px}.hero{padding:72px 0 48px;display:grid;grid-template-columns:1.15fr .85fr;gap:50px;align-items:center}.hero h1{font-size:clamp(48px,6vw,82px);line-height:.98;letter-spacing:-4px;margin:14px 0 22px}.hero h1 span{background:linear-gradient(90deg,var(--violet),var(--pink));-webkit-background-clip:text;color:transparent}.hero p{font-size:20px;line-height:1.6;color:var(--muted);max-width:700px}.hero-art{min-height:330px;border-radius:38px;background:linear-gradient(135deg,#7458f5,#b76ef7 50%,#ff7fb2);padding:28px;box-shadow:0 25px 70px #6e52de40}.float-card{background:#fff;border-radius:24px;padding:22px;margin:18px;box-shadow:0 16px 40px #412a822e;transform:rotate(-2deg)}.float-card:nth-child(2){transform:rotate(3deg);margin-left:70px}.pill,.eyebrow{display:inline-flex;border-radius:999px;padding:8px 12px;background:#f0ecff;font-size:12px;font-weight:900;text-transform:uppercase}.section-head{display:flex;justify-content:space-between;align-items:end;gap:20px;margin:20px 0 25px}.section-head h2{font-size:40px;margin:5px 0 0}.section-head p,.card p,.product-info p,.mini{color:var(--muted)}.grid{display:grid;grid-template-columns:repeat(3,1fr);gap:25px}.card{border:1px solid var(--line);border-radius:28px;overflow:hidden;background:#fff;box-shadow:0 12px 35px #47376e14;transition:.2s}.card:hover{transform:translateY(-6px);box-shadow:0 22px 50px #47376e24}.cover{aspect-ratio:4/3;background:linear-gradient(135deg,#e6f7ff,#f1e9ff 50%,#ffe8f2);display:flex;align-items:center;justify-content:center;overflow:hidden;text-decoration:none}.cover img{width:100%;height:100%;object-fit:cover}.pad{padding:25px}.card h2{font-size:23px;line-height:1.15;margin:13px 0 10px}.card p{line-height:1.5}.price-row{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:22px}.price{font-size:28px;font-weight:900}.btn{display:inline-flex;background:linear-gradient(90deg,#7257f5,#9d6ef5);color:#fff;border:0;border-radius:15px;padding:14px 19px;font-weight:900;text-decoration:none;cursor:pointer;box-shadow:0 8px 20px #7257f538}.product{padding-top:55px;display:grid;grid-template-columns:1.08fr .92fr;gap:50px;align-items:start}.gallery-main{border-radius:30px;overflow:hidden;border:1px solid var(--line);box-shadow:0 20px 55px #402d691c}.gallery-main img{width:100%;display:block}.thumbs{display:flex;gap:12px;flex-wrap:wrap;margin-top:15px}.thumbs img{width:112px;height:82px;object-fit:cover;border-radius:14px;cursor:pointer}.product-info{background:#fff;border:1px solid var(--line);border-radius:30px;padding:34px;box-shadow:0 18px 50px #47376e14;position:sticky;top:100px}.product-info h1{font-size:clamp(40px,5vw,60px);line-height:1.03;margin:15px 0 22px}.product-info p{font-size:17px;line-height:1.65}.empty-cover{font-size:55px}@media(max-width:950px){.hero{grid-template-columns:1fr}.hero-art{display:none}.grid{grid-template-columns:repeat(2,1fr)}.product{grid-template-columns:1fr}.product-info{position:static}}@media(max-width:650px){.grid{grid-template-columns:1fr}.section-head{align-items:start;flex-direction:column}.hero h1{letter-spacing:-2px}header{padding:0 4%}.logo{font-size:22px}main{padding-left:4%;padding-right:4%}}
.site-footer{
    margin-top:70px;
    padding:42px 5%;
    background:linear-gradient(135deg,#f2efff,#fff0f7);
    border-top:1px solid #ebe8f5;
}
.footer-inner{
    max-width:1420px;
    margin:auto;
}
.footer-brand{
    display:flex;
    flex-direction:column;
    gap:5px;
    font-size:18px;
    margin-bottom:22px;
}
.footer-brand strong{
    font-size:22px;
}
.footer-brand span,
.footer-copy{
    color:#716c82;
}
.footer-links{
    display:flex;
    flex-wrap:wrap;
    gap:10px 24px;
    margin-bottom:25px;
}
.footer-links a{
    color:#5d4cc5;
    text-decoration:none;
    font-weight:700;
}
.footer-links a:hover{
    text-decoration:underline;
}
.footer-copy{
    font-size:13px;
}

.hero-image-wrap{
    width:100%;
    max-width:520px;
    height:420px;
    display:flex;
    align-items:center;
    justify-content:center;
    overflow:hidden;
}

.hero-image{
    display:block;
    width:100%;
    height:100%;
    max-width:520px;
    max-height:420px;
    object-fit:contain;
    border-radius:28px;
}

@media (max-width:700px){
    .hero-image-wrap{
        max-width:100%;
        height:280px;
    }

    .hero-image{
        max-width:100%;
        max-height:280px;
    }
}

.hero-art{
    display:flex;
    align-items:center;
    justify-content:flex-end;
    width:100%;
}

.hero-image-wrap{
    width:400px;
    height:340px;
    display:flex;
    align-items:center;
    justify-content:flex-end;
    overflow:hidden;
}

.hero-image{
    display:block;
    width:100%;
    height:100%;
    object-fit:contain;
    object-position:center right;
    border-radius:28px;
}

@media (max-width:700px){
    .hero-art{
        justify-content:center;
    }

    .hero-image-wrap{
        width:100%;
        max-width:360px;
        height:280px;
    }

    .hero-image{
        object-position:center;
    }
}

/* =========================================================
   НОВЫЙ ДИЗАЙН МАГАЗИНА MATERIALYDOU
   ========================================================= */

.shop-page{
    --shop-pink:#f56f91;
    --shop-pink-dark:#e65378;
    --shop-blue:#24476d;
    --shop-cream:#fff9f3;
    --shop-green:#72b9a8;
    --shop-yellow:#f2c66d;
    --shop-text:#253246;
    --shop-muted:#718096;
    --shop-border:#eee7e1;
    --shop-shadow:0 18px 50px rgba(55,42,32,.09);
    color:var(--shop-text);
}

/* ---------- HERO ---------- */

.shop-page .shop-hero{
    max-width:1280px;
    margin:35px auto 30px;
    min-height:520px;
    padding:70px 65px;
    border-radius:38px;
    background:
        radial-gradient(circle at 88% 15%,rgba(255,255,255,.95) 0 8%,transparent 25%),
        linear-gradient(120deg,#fff7ed 0%,#fffdf9 52%,#fcecef 100%);
    display:grid;
    grid-template-columns:1.05fr .95fr;
    align-items:center;
    gap:35px;
    position:relative;
    overflow:hidden;
    box-shadow:var(--shop-shadow);
}

.shop-page .shop-hero:before{
    content:"";
    position:absolute;
    width:250px;
    height:250px;
    border-radius:50%;
    background:rgba(245,111,145,.10);
    left:-100px;
    bottom:-110px;
}

.shop-page .shop-hero-content{
    position:relative;
    z-index:2;
}

.shop-page .shop-badge{
    display:inline-flex;
    align-items:center;
    gap:8px;
    padding:10px 17px;
    border-radius:999px;
    background:#fff;
    color:var(--shop-pink-dark);
    font-size:14px;
    font-weight:700;
    box-shadow:0 7px 25px rgba(80,50,40,.07);
    margin-bottom:22px;
}

.shop-page .shop-hero h1{
    margin:0 0 22px;
    max-width:680px;
    font-size:clamp(42px,5vw,72px);
    line-height:1.03;
    letter-spacing:-2.5px;
    color:var(--shop-blue);
    font-weight:900;
}

.shop-page .shop-hero-text{
    max-width:650px;
    font-size:19px;
    line-height:1.65;
    color:#5f6d7d;
    margin:0 0 23px;
}

.shop-page .shop-hero-points{
    display:flex;
    flex-wrap:wrap;
    gap:9px;
    margin-bottom:30px;
}

.shop-page .shop-hero-points span{
    background:rgba(255,255,255,.82);
    border:1px solid rgba(255,255,255,.95);
    border-radius:14px;
    padding:9px 13px;
    font-size:13px;
    font-weight:700;
    color:#506070;
}

.shop-page .shop-main-btn{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:8px;
    min-height:54px;
    padding:0 28px;
    border-radius:17px;
    background:linear-gradient(135deg,var(--shop-pink),#ff829f);
    color:#fff !important;
    font-weight:800;
    font-size:16px;
    text-decoration:none !important;
    box-shadow:0 12px 28px rgba(245,111,145,.28);
    transition:.2s ease;
}

.shop-page .shop-main-btn:hover{
    transform:translateY(-2px);
    box-shadow:0 16px 35px rgba(245,111,145,.34);
}

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

.shop-page .shop-hero-picture{
    width:min(100%,520px);
    height:410px;
    border-radius:30px;
    overflow:hidden;
    background:#fff;
    box-shadow:0 20px 55px rgba(67,49,38,.14);
}

.shop-page .shop-hero-picture img{
    width:100%;
    height:100%;
    object-fit:cover;
    display:block;
}

/* Если иллюстрации нет */

.shop-page .shop-hero-decoration{
    width:470px;
    height:390px;
    position:relative;
}

.shop-page .hero-folder{
    position:absolute;
    width:290px;
    min-height:120px;
    padding:24px;
    border-radius:20px;
    box-shadow:0 20px 45px rgba(70,50,40,.13);
    display:flex;
    flex-direction:column;
    justify-content:center;
}

.shop-page .hero-folder span{
    font-size:13px;
    font-weight:800;
    letter-spacing:1px;
}

.shop-page .hero-folder b{
    font-size:26px;
    margin-top:6px;
}

.shop-page .hero-folder-1{
    background:#eaf5ef;
    color:#397363;
    left:10px;
    top:30px;
    transform:rotate(-5deg);
}

.shop-page .hero-folder-2{
    background:#fff0e8;
    color:#a65d43;
    right:0;
    top:135px;
    transform:rotate(6deg);
}

.shop-page .hero-folder-3{
    background:#edf1fa;
    color:#405a84;
    left:70px;
    bottom:5px;
    transform:rotate(-3deg);
}

.shop-page .hero-flower{
    position:absolute;
    right:55px;
    top:5px;
    font-size:70px;
    color:#f0b6c4;
}

.shop-page .hero-star{
    position:absolute;
    left:0;
    bottom:55px;
    font-size:55px;
    color:#e7bd58;
}

/* ---------- SECTIONS ---------- */

.shop-page .shop-section{
    max-width:1280px;
    margin:0 auto;
    padding:55px 0;
}

.shop-page .shop-section-title{
    margin-bottom:28px;
}

.shop-page .shop-section-title h2{
    margin:5px 0 0;
    font-size:34px;
    line-height:1.15;
    color:var(--shop-blue);
    letter-spacing:-1px;
}

.shop-page .shop-overline{
    display:inline-block;
    color:var(--shop-pink-dark);
    font-size:13px;
    font-weight:800;
    text-transform:uppercase;
    letter-spacing:1.5px;
}

.shop-page .shop-title-row{
    display:flex;
    align-items:flex-end;
    justify-content:space-between;
    gap:20px;
}

.shop-page .shop-count{
    color:#8994a1;
    font-weight:700;
}

/* ---------- CATEGORIES ---------- */

.shop-page .shop-category-list{
    display:grid;
    grid-template-columns:repeat(7,1fr);
    gap:12px;
}

.shop-page .shop-category{
    min-height:112px;
    padding:18px 12px;
    border:1px solid var(--shop-border);
    border-radius:22px;
    background:#fff;
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    gap:10px;
    text-align:center;
    color:var(--shop-text);
    text-decoration:none;
    box-shadow:0 8px 25px rgba(60,45,35,.04);
    transition:.2s ease;
}

.shop-page .shop-category:hover{
    transform:translateY(-4px);
    border-color:#f3c2cd;
    box-shadow:0 14px 35px rgba(60,45,35,.09);
}

.shop-page .shop-category-icon{
    width:48px;
    height:48px;
    display:flex;
    align-items:center;
    justify-content:center;
    border-radius:16px;
    background:#fff3f6;
    font-size:24px;
}

.shop-page .shop-category span:last-child{
    font-size:13px;
    font-weight:750;
}

/* ---------- PRODUCTS ---------- */

.shop-page .shop-products{
    display:grid;
    grid-template-columns:repeat(4,1fr);
    gap:22px;
}

.shop-page .shop-product{
    background:#fff;
    border:1px solid var(--shop-border);
    border-radius:27px;
    overflow:hidden;
    box-shadow:0 10px 35px rgba(50,40,30,.06);
    transition:.25s ease;
}

.shop-page .shop-product:hover{
    transform:translateY(-5px);
    box-shadow:0 20px 48px rgba(50,40,30,.12);
}

.shop-page .shop-product-cover{
    display:block;
    height:280px;
    position:relative;
    overflow:hidden;
    background:#f7f3ee;
    text-decoration:none;
}

.shop-page .shop-product-cover img{
    width:100%;
    height:100%;
    object-fit:cover;
    display:block;
    transition:.35s ease;
}

.shop-page .shop-product:hover .shop-product-cover img{
    transform:scale(1.035);
}

.shop-page .shop-product-badge{
    position:absolute;
    top:14px;
    left:14px;
    padding:7px 11px;
    border-radius:999px;
    background:#fff;
    color:var(--shop-pink-dark);
    font-size:11px;
    font-weight:800;
    box-shadow:0 6px 18px rgba(40,30,20,.10);
}

.shop-page .shop-empty-cover{
    height:100%;
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    gap:10px;
    color:#789;
    background:linear-gradient(145deg,#fff5ef,#edf5f3);
}

.shop-page .shop-empty-cover span{
    font-size:55px;
}

.shop-page .shop-product-body{
    padding:21px;
}

.shop-page .shop-product-category{
    color:var(--shop-pink-dark);
    font-size:11px;
    font-weight:800;
    text-transform:uppercase;
    letter-spacing:1px;
}

.shop-page .shop-product h3{
    margin:8px 0 9px;
    font-size:20px;
    line-height:1.2;
}

.shop-page .shop-product h3 a{
    color:var(--shop-blue);
    text-decoration:none;
}

.shop-page .shop-product-body p{
    margin:0;
    min-height:58px;
    color:#788493;
    font-size:14px;
    line-height:1.5;
}

.shop-page .shop-product-bottom{
    margin-top:18px;
    padding-top:16px;
    border-top:1px solid #f0ebe6;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:10px;
}

.shop-page .shop-price{
    color:var(--shop-blue);
    font-size:23px;
}

.shop-page .shop-more{
    color:var(--shop-pink-dark);
    font-size:13px;
    font-weight:800;
    text-decoration:none;
}

/* ---------- BENEFITS ---------- */

.shop-page .shop-benefits-section{
    max-width:none;
    padding:70px max(25px,calc((100% - 1280px)/2));
    background:#fff8f4;
}

.shop-page .shop-section-title.centered{
    text-align:center;
}

.shop-page .shop-benefits{
    max-width:1280px;
    margin:35px auto 0;
    display:grid;
    grid-template-columns:repeat(4,1fr);
    gap:20px;
}

.shop-page .shop-benefit{
    padding:30px 25px;
    border-radius:25px;
    background:#fff;
    border:1px solid #f1e9e3;
    text-align:center;
}

.shop-page .shop-benefit-icon{
    width:62px;
    height:62px;
    margin:0 auto 17px;
    border-radius:20px;
    background:#fff0f4;
    display:flex;
    align-items:center;
    justify-content:center;
    font-size:28px;
}

.shop-page .shop-benefit h3{
    margin:0 0 9px;
    color:var(--shop-blue);
    font-size:18px;
}

.shop-page .shop-benefit p{
    margin:0;
    color:#788493;
    font-size:14px;
    line-height:1.55;
}

/* ---------- ABOUT ---------- */

.shop-page .shop-about{
    max-width:1280px;
    margin:0 auto;
    padding:90px 0;
    display:grid;
    grid-template-columns:.85fr 1.15fr;
    gap:75px;
    align-items:center;
}

.shop-page .shop-about-visual{
    min-height:390px;
    position:relative;
    border-radius:35px;
    background:linear-gradient(145deg,#edf6f3,#fff1ee);
    display:flex;
    align-items:center;
    justify-content:center;
    overflow:hidden;
}

.shop-page .shop-about-card{
    width:245px;
    height:300px;
    background:#fff;
    border-radius:22px;
    box-shadow:0 25px 50px rgba(60,45,35,.14);
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    transform:rotate(-5deg);
    color:var(--shop-blue);
}

.shop-page .shop-about-book{
    font-size:70px;
    margin-bottom:15px;
}

.shop-page .shop-about-card strong{
    font-size:30px;
}

.shop-page .shop-about-card span{
    color:var(--shop-pink-dark);
    font-weight:800;
    margin-top:5px;
}

.shop-page .shop-about-note{
    position:absolute;
    right:35px;
    bottom:35px;
    padding:18px 22px;
    border-radius:17px;
    background:#f7d36f;
    color:#624d21;
    transform:rotate(5deg);
    box-shadow:0 12px 30px rgba(80,60,20,.12);
}

.shop-page .shop-about-note span,
.shop-page .shop-about-note b{
    display:block;
}

.shop-page .shop-about-note b{
    font-size:18px;
    margin-top:4px;
}

.shop-page .shop-about-content h2{
    margin:8px 0 20px;
    color:var(--shop-blue);
    font-size:42px;
    line-height:1.1;
    letter-spacing:-1.5px;
}

.shop-page .shop-about-content p{
    color:#687586;
    font-size:17px;
    line-height:1.7;
}

.shop-page .shop-about-features{
    display:flex;
    flex-wrap:wrap;
    gap:10px;
    margin:25px 0;
}

.shop-page .shop-about-features span{
    padding:9px 14px;
    border-radius:999px;
    background:#fff2f5;
    color:var(--shop-pink-dark);
    font-size:13px;
    font-weight:800;
}

.shop-page .shop-outline-btn{
    display:inline-flex;
    padding:14px 20px;
    border:2px solid #f2a0b3;
    border-radius:15px;
    color:var(--shop-pink-dark);
    font-weight:800;
    text-decoration:none;
}

/* ---------- FINAL ---------- */

.shop-page .shop-final{
    max-width:1280px;
    margin:10px auto 80px;
    padding:50px 60px;
    border-radius:30px;
    background:linear-gradient(120deg,#274c73,#3f658a);
    color:#fff;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:30px;
    box-shadow:0 20px 50px rgba(35,63,91,.18);
}

.shop-page .shop-final .shop-overline{
    color:#ffd5df;
}

.shop-page .shop-final h2{
    margin:8px 0;
    font-size:38px;
    line-height:1.1;
}

.shop-page .shop-final p{
    margin:0;
    opacity:.82;
}

.shop-page .shop-main-btn.light{
    background:#fff;
    color:var(--shop-blue) !important;
    box-shadow:none;
    white-space:nowrap;
}

/* ---------- ADAPTIVE ---------- */

@media (max-width:1100px){

    .shop-page .shop-hero{
        grid-template-columns:1fr;
        padding:50px 40px;
    }

    .shop-page .shop-hero-visual{
        justify-content:center;
    }

    .shop-page .shop-category-list{
        grid-template-columns:repeat(4,1fr);
    }

    .shop-page .shop-products{
        grid-template-columns:repeat(3,1fr);
    }

    .shop-page .shop-benefits{
        grid-template-columns:repeat(2,1fr);
    }

    .shop-page .shop-about{
        padding-left:25px;
        padding-right:25px;
    }
}

@media (max-width:750px){

    .shop-page .shop-hero{
        margin:15px;
        padding:35px 23px;
        border-radius:27px;
    }

    .shop-page .shop-hero h1{
        font-size:42px;
        letter-spacing:-1.5px;
    }

    .shop-page .shop-hero-text{
        font-size:16px;
    }

    .shop-page .shop-hero-points{
        flex-direction:column;
    }

    .shop-page .shop-hero-visual{
        min-height:300px;
    }

    .shop-page .shop-hero-picture{
        height:290px;
    }

    .shop-page .shop-hero-decoration{
        transform:scale(.78);
        transform-origin:center;
        margin:-40px;
    }

    .shop-page .shop-section{
        padding:40px 18px;
    }

    .shop-page .shop-section-title h2{
        font-size:28px;
    }

    .shop-page .shop-category-list{
        grid-template-columns:repeat(2,1fr);
    }

    .shop-page .shop-products{
        grid-template-columns:1fr;
    }

    .shop-page .shop-product-cover{
        height:330px;
    }

    .shop-page .shop-benefits{
        grid-template-columns:1fr;
    }

    .shop-page .shop-about{
        grid-template-columns:1fr;
        padding:55px 18px;
        gap:35px;
    }

    .shop-page .shop-about-content h2{
        font-size:34px;
    }

    .shop-page .shop-final{
        margin:10px 18px 50px;
        padding:35px 25px;
        flex-direction:column;
        align-items:flex-start;
    }

    .shop-page .shop-final h2{
        font-size:31px;
    }

    .shop-page .shop-title-row{
        align-items:flex-start;
        flex-direction:column;
    }
}


/* ---------- НАЗВАНИЕ НА ОБЛОЖКЕ ТОВАРА ---------- */

.shop-page .shop-product-cover{
    position:relative;
}

.shop-page .shop-cover-overlay{
    position:absolute;
    inset:0;
    background:linear-gradient(
        to top,
        rgba(20,35,55,.78) 0%,
        rgba(20,35,55,.35) 32%,
        transparent 65%
    );
    pointer-events:none;
}

.shop-page .shop-cover-title{
    position:absolute;
    left:18px;
    right:18px;
    bottom:17px;
    z-index:3;
    color:#fff;
}

.shop-page .shop-cover-title strong{
    display:block;
    font-size:22px;
    line-height:1.08;
    font-weight:900;
    letter-spacing:-.3px;
    text-shadow:0 2px 8px rgba(0,0,0,.22);
}

.shop-page .shop-cover-title span{
    display:inline-block;
    margin-top:9px;
    padding:6px 11px;
    border-radius:999px;
    background:rgba(255,255,255,.94);
    color:#df5577;
    font-size:11px;
    font-weight:900;
    letter-spacing:.4px;
    box-shadow:0 5px 15px rgba(0,0,0,.12);
}

@media (max-width:750px){
    .shop-page .shop-cover-title strong{
        font-size:24px;
    }
}


/* Фото автора в блоке «О сообществе» */

.shop-page .shop-about-photo{
    width:290px;
    height:360px;
    border-radius:28px;
    overflow:hidden;
    background:#fff;
    box-shadow:0 25px 55px rgba(60,45,35,.16);
    transform:rotate(-3deg);
    position:relative;
    z-index:2;
}

.shop-page .shop-about-photo img{
    width:100%;
    height:100%;
    display:block;
    object-fit:cover;
}

@media (max-width:750px){
    .shop-page .shop-about-photo{
        width:250px;
        height:320px;
    }
}

