/* =========================
   FONTS & VARIABLES
========================= */

:root {

    --bg: #F7F4EF;
    --text: #2F2F2F;
    --text-light: #5F5F5F;

    --accent: #7B6A59;
    --border: #DDD5CB;

    --container: 1400px;

}

/* =========================
   RESET
========================= */

*{
    margin:0;
    padding:0;
    box-sizing:border-box;
}

html{
    scroll-behavior:smooth;
}

body{

    background:var(--bg);

    color:var(--text);

    font-family:Inter,sans-serif;

    overflow-x:hidden;

    -webkit-font-smoothing:antialiased;
    -moz-osx-font-smoothing:grayscale;

}

img{
    display:block;
    max-width:100%;
}

a{
    text-decoration:none;
    color:inherit;
}

.container{

    width:min(1200px,92%);
    margin:auto;

}

/* =========================
   HEADER
========================= */

.header{

    position:fixed;

    top:0;
    left:0;

    width:100%;

    z-index:1000;

    background:rgba(247,244,239,.72);

    backdrop-filter:blur(20px);

}

.header .container{

    display:flex;
    justify-content:space-between;
    align-items:center;

    padding:28px 0;

}

.logo{

    display:flex;
    flex-direction:column;
    gap:4px;

}

.logo span{

    font-size:18px;
    font-weight:600;

}

.logo small{

    font-size:14px;
    opacity:.6;

}

nav{

    display:flex;
    gap:40px;

}

nav a{

    font-size:15px;

    opacity:.75;

    transition:.3s;

}

nav a:hover{

    opacity:1;

}

/* =========================
   HERO
========================= */

.hero{

    min-height:100vh;

    display:flex;
    align-items:center;

    padding-top:120px;

}

.hero-grid{

    display:grid;

    grid-template-columns:1fr 1fr;

    gap:100px;

    align-items:center;

}

.eyebrow{

    text-transform:uppercase;

    letter-spacing:.25em;

    color:var(--accent);

    font-size:12px;

}

.hero h1{

    margin-top:24px;

    font-family:"Instrument Serif",serif;

    font-size:clamp(64px,8vw,110px);

    line-height:.92;

    font-weight:400;

    letter-spacing:-0.04em;

}

.hero p{

    margin-top:40px;

    max-width:540px;

    font-size:22px;

    line-height:1.8;

    color:var(--text-light);

}
.hero-facts {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    margin-top: 28px;
}

.hero-facts span {
    padding: 10px 18px;
    border: 1px solid rgba(123,106,89,.15);
    border-radius: 999px;
    background: rgba(255,255,255,.55);

    font-size: 14px;
    color: rgba(47,47,47,.75);
}

.hero-buttons{

    margin-top:50px;

    display:flex;

    flex-wrap:wrap;

    gap:16px;

    align-items:center;

}

.btn{

    display:inline-flex;

    align-items:center;

    justify-content:center;

    padding:18px 36px;

    border-radius:999px;

    background:var(--accent);

    color:white;

    transition:.35s;

}

.btn:hover{

    transform:translateY(-2px);

}

.price{

    padding:18px 28px;

    border:1px solid var(--border);

    border-radius:999px;

}

.hero-image{

    position:relative;

    height:860px;

    overflow:hidden;

    border-radius:40px;

}

.hero-image img{

    width:100%;
    height:100%;

    object-fit:cover;

    transition:1s;

}

.hero-image:hover img{

    transform:scale(1.03);

}

/* =========================
   PROBLEMS
========================= */

.problems{

    padding:280px 0;

}

.section-label{

    text-transform:uppercase;

    letter-spacing:.25em;

    font-size:12px;

    color:var(--accent);

    margin-bottom:80px;

}

.problem-list{

    display:flex;
    flex-direction:column;

    gap:80px;

}

.problem-item{

    font-family:"Instrument Serif",serif;

    font-size:clamp(42px,6vw,78px);

    line-height:.98;

    letter-spacing:-0.03em;

    max-width:1200px;

}

.problem-footer{

    margin-top:120px;

    font-size:24px;

    color:var(--text-light);

}

/* =========================
   TRUST
========================= */

.trust{

    padding:180px 0;

}

.trust-header h2 {
    font-family: "Instrument Serif", serif;
    font-size: clamp(48px, 6vw, 88px);
    font-weight: 400;
    margin-bottom: 40px;
}
.trust-header p {
    max-width: 720px;
    font-size: 20px;
    line-height: 1.9;
    color: rgba(47, 47, 47, .75);
    margin-top:30px;
    margin-bottom: 64px;
}

.trust-grid{

    display:grid;

    grid-template-columns:repeat(4,1fr);

    gap:30px;

}

.trust-card{

    padding:40px;

    border:1px solid var(--border);

    border-radius:28px;

    background:rgba(255,255,255,.4);

}

.trust-card h3{

    font-family:"Instrument Serif",serif;

    font-size:54px;

    font-weight:400;

}

.trust-card p{

    margin-top:10px;

    color:var(--text-light);

    line-height:1.7;

}

/* =========================
   SECTION
========================= */

.section{

    padding:220px 0;

}

.section-title{

    font-family:"Instrument Serif",serif;

    font-size:clamp(48px,5vw,78px);

    font-weight:400;

    line-height:1;

    letter-spacing:-0.03em;

    margin-bottom:80px;

}

.section-text{

    max-width:760px;

    font-size:22px;

    line-height:1.9;

    color:var(--text-light);

}

/* =========================
   ABOUT
========================= */

.about-grid{

    display:grid;

    grid-template-columns:1fr 1fr;

    gap:100px;

    align-items:center;

}

.about-image{

    height:800px;

    border-radius:40px;

    overflow:hidden;

}

.about-image img{

    width:100%;
    height:100%;

    object-fit:cover;

}

.about-content p{

    font-size:22px;

    line-height:1.9;

    color:var(--text-light);

}

/* =========================
   EDUCATION
========================= */

.education{

    padding:220px 0;

}

.timeline{

    max-width:900px;

}

.timeline-item{

    padding:40px 0;

    border-bottom:1px solid var(--border);

}

.timeline-year{

    color:var(--accent);

    margin-bottom:12px;

}

.timeline-title{

    font-size:28px;

    margin-bottom:10px;

}

/* =========================
   PROCESS
========================= */

.process-grid{

    display:grid;

    grid-template-columns:repeat(4,1fr);

    gap:30px;

}

.process-card{

    background:white;

    border:1px solid var(--border);

    border-radius:32px;

    padding:40px;

    transition:.3s;

}

.process-card:hover{

    transform:translateY(-4px);

}

.process-number{

    font-family:"Instrument Serif",serif;

    font-size:42px;

    color:var(--accent);

    margin-bottom:30px;

}

.process-card h3{

    font-size:24px;

    margin-bottom:16px;

    font-weight:500;

}

.process-card p{

    color:var(--text-light);

    line-height:1.8;

}

/* =========================
   PRICING
========================= */

.pricing-grid{

    display:grid;

    grid-template-columns:repeat(2,1fr);

    gap:30px;

}

.price-card{

    border:1px solid var(--border);

    border-radius:32px;

    padding:60px;

}

.price-card h3{

    font-size:28px;

    margin-bottom:20px;

}

.price-value{

    font-family:"Instrument Serif",serif;

    font-size:72px;

    line-height:1;

}

.price-time{

    margin-top:20px;

    color:var(--text-light);

}

/* ==========================
   CONTACT PREMIUM
========================== */

.contact-section {

    padding: 220px 0;

}

.contact-wrapper {

    display: grid;

    grid-template-columns: 1fr 600px;

    gap: 120px;

    align-items: center;

}

.contact-label {

    display: inline-block;

    text-transform: uppercase;

    letter-spacing: .25em;

    font-size: 12px;

    color: var(--accent);

    margin-bottom: 24px;

}

.contact-left h2 {

    font-family: "Instrument Serif", serif;

    font-size: clamp(52px, 6vw, 92px);

    line-height: .95;

    font-weight: 400;

    letter-spacing: -0.03em;

    margin-bottom: 40px;

}

.contact-left p {

    font-size: 22px;

    line-height: 1.8;

    color: var(--text-light);

    max-width: 600px;

}

.contact-points {

    display: flex;

    flex-wrap: wrap;

    gap: 12px;

    margin-top: 50px;

}

.contact-points div {

    padding: 14px 22px;

    border: 1px solid var(--border);

    border-radius: 999px;

    font-size: 14px;

}

/* CARD */

.contact-card {

    background: #fff;

    border: 1px solid #e8e0d7;

    border-radius: 32px;

    padding: 50px;

    box-shadow:
        0 20px 60px rgba(0,0,0,.04);

}

.contact-card form {

    display: flex;

    flex-direction: column;

    gap: 16px;

}

.contact-card input,
.contact-card select {

    width: 100%;

    height: 64px;

    padding: 0 20px;

    border: 1px solid #ddd;

    border-radius: 18px;

    font-size: 16px;

    background: #fff;

    transition: .3s;

}

.contact-card input:focus,
.contact-card select:focus {

    outline: none;

    border-color: var(--accent);

}

.contact-card select {

    appearance: none;

    cursor: pointer;

    background-image:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 24 24' fill='none' stroke='%237B6A59' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'%3E%3C/polyline%3E%3C/svg%3E");

    background-repeat: no-repeat;

    background-position: right 20px center;

    padding-right: 50px;

}

.contact-card button {

    height: 68px;

    border: none;

    border-radius: 18px;

    background: var(--accent);

    color: white;

    font-size: 18px;

    cursor: pointer;

    transition: .3s;

}

.contact-card button:hover {

    transform: translateY(-2px);

}

.contact-note {

    margin-top: 20px;

    text-align: center;

    color: #888;

    font-size: 14px;

}




/* =========================
   FOOTER
========================= */

.footer{

    padding:80px 0;

    border-top:1px solid var(--border);

}

.footer-content{

    display:flex;

    justify-content:space-between;

    gap:40px;

}


/* =========================
   DIRECTIONS
========================= */

.directions-grid {

    display:grid;

    grid-template-columns:repeat(2,1fr);

    gap:30px;

}

.direction-card {

    padding:50px;

    border:1px solid var(--border);

    border-radius:32px;

    background:rgba(255,255,255,.4);

    transition:.35s;

}

.direction-card:hover {

    transform:translateY(-4px);

}

.direction-card h3 {

    font-family:"Instrument Serif",serif;

    font-size:36px;

    font-weight:400;

    line-height:1.1;

    margin-bottom:24px;

}

.direction-card p {

    font-size:18px;

    line-height:1.8;

    color:var(--text-light);

}

/* =========================
   OFFICE
========================= */

.office-image {

    width:100%;

    height:750px;

    object-fit:cover;

    border-radius:40px;

    margin-bottom:80px;

}

.office-content {

    max-width:900px;

}

.office-content p {

    font-size:22px;

    line-height:1.9;

    color:var(--text-light);

}

/* =========================
   FORM
========================= */

.form {

    max-width:700px;

}

textarea.input {

    resize:vertical;

    min-height:140px;

}

.input:focus {

    outline:none;

    border-color:var(--accent);

}

/* =========================
   BUTTON
========================= */

button.btn {

    border:none;

    cursor:pointer;

    font-size:16px;

}

/* =========================
   FOOTER
========================= */

/* ==========================
   PREMIUM FOOTER
========================== */

.footer-premium {

    background: #000;

    color: white;

    padding: 80px 60px 60px;

}

/* соцсети */

.footer-socials {

    display: flex;

    justify-content: center;

    align-items: center;

    margin-bottom: 180px;

}

.footer-socials a {

    color: #d7c0aa;

    text-decoration: none;

    font-size: 42px;

    transition: .3s;
    
    padding: 0 65px;

}

.footer-socials a:hover {

    color: white;

}

/* центр */

.footer-center {

    text-align: center;

}

.footer-center h2 {

    font-family: "Instrument Serif", serif;

    font-size: clamp(64px, 8vw, 92px);

    font-weight: 400;

    line-height: .95;

}

.footer-center p {

    margin-top: 20px;

    color: rgba(255,255,255,.6);

    font-size: 22px;
    
        max-width: none;

}

.footer-phone {

    display: inline-block;

    margin-top: 80px;

    color: white;

    text-decoration: none;

    font-size: clamp(34px,4vw,64px);

    font-weight: 300;

}

.footer-phone:hover {

    color: #d7c0aa;

}

/* низ */

.footer-bottom {

    margin-top: 180px;

    display: flex;

    justify-content: space-between;

    align-items: center;

    border-top: 1px solid rgba(255,255,255,.12);

    padding-top: 40px;

}

.footer-bottom span {

    color: rgba(255,255,255,.5);

}

.footer-links {

    display: flex;

    gap: 30px;

}

.footer-links a {

    color: rgba(255,255,255,.5);

    text-decoration: none;

}

.footer-links a:hover {

    color: white;

}



/* =========================
   ANIMATION
========================= */

.hero-content,
.hero-image,
.problem-item,
.trust-card,
.direction-card,
.about-image,
.about-content,
.timeline-item,
.price-card {

    animation:fadeUp .8s ease forwards;

}

@keyframes fadeUp {

    from {

        opacity:0;

        transform:translateY(20px);

    }

    to {

        opacity:1;

        transform:translateY(0);

    }

}


/* =========================
   JS ANIMATION
========================= */

.hidden-block {

    opacity: 0;

    transform: translateY(30px);

    transition: .8s;

}

.visible {

    opacity: 1;

    transform: translateY(0);

}

.success-message {

    padding: 50px;

    border: 1px solid var(--border);

    border-radius: 30px;

    text-align: center;

}

.success-message h3 {

    font-family: "Instrument Serif", serif;

    font-size: 48px;

    font-weight: 400;

    margin-bottom: 20px;

}

.success-message p {

    color: var(--text-light);

}
/* ==================================
   RESPONSIVE
================================== */

@media (max-width: 1024px) {

    nav {
        display: none;
    }

    .hero-grid,
    .about-grid,
    .pricing-grid,
    .trust-grid,
    .directions-grid,
    .contact-wrapper {
        grid-template-columns: 1fr;
    }

    .hero-grid,
    .about-grid,
    .contact-wrapper {
        gap: 60px;
    }

    .hero-image,
    .about-image {
        height: 600px;
    }

    .office-image {
        height: 500px;
    }

    .section,
    .education,
    .contact-section,
    .problems {
        padding: 120px 0;
    }

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

@media (max-width: 768px) {

    .container {
        width: 92%;
        max-width: 92%;
    }

    .header .container {
        padding: 18px 0;
    }

    .logo span {
        font-size: 16px;
    }

    .logo small {
        font-size: 12px;
    }

    .hero {
        padding-top: 110px;
        min-height: auto;
    }

    .hero h1 {
        font-size: 52px;
        line-height: .95;
    }

    .hero p {
        font-size: 18px;
        margin-top: 24px;
    }

    .hero-buttons {
        flex-direction: column;
        align-items: stretch;
    }

    .btn,
    .price {
        width: 100%;
        justify-content: center;
        text-align: center;
    }

    .hero-image {
        height: 450px;
        border-radius: 24px;
    }

    .about-image {
        height: 450px;
        border-radius: 24px;
    }

    .office-image {
        height: 400px;
        border-radius: 24px;
    }

    .problem-item {
        font-size: 34px;
    }

    .problem-footer {
        margin-top: 40px;
        font-size: 18px;
    }

    .section-title {
        font-size: 42px;
        margin-bottom: 40px;
    }

    .section-text,
    .about-content p,
    .office-content p,
    .contact-left p {
        font-size: 18px;
    }

    .trust-grid {
        grid-template-columns: 1fr;
    }

    .trust-card,
    .direction-card,
    .price-card {
        padding: 28px;
    }

    .trust-card h3 {
        font-size: 40px;
    }

    .direction-card h3 {
        font-size: 28px;
    }

    .timeline-title {
        font-size: 22px;
    }

    .price-value {
        font-size: 52px;
    }

    .contact-left h2 {
        font-size: 42px;
    }

    .contact-card {
        padding: 24px;
        border-radius: 24px;
    }

    .contact-card input,
    .contact-card select,
    .contact-card button {
        height: 58px;
        font-size: 16px;
    }

    .footer-premium {
        padding: 60px 24px;
    }

    .footer-socials {
        justify-content: center;
        flex-wrap: wrap;
        gap: 2px;
        margin-bottom: 60px;
    }

    .footer-center h2 {
        font-size: 52px;
    }

    .footer-center p {
        font-size: 18px;
    }

    .footer-phone {
        font-size: 32px;
        margin-top: 30px;
    }

    .footer-bottom {
        flex-direction: column;
        text-align: center;
        gap: 16px;
        margin-top: 10px;
    }

    .footer-links {
        flex-direction: column;
        gap: 10px;
    }
}

@media (max-width: 480px) {

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

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

    .section-title {
        font-size: 34px;
    }

    .contact-left h2 {
        font-size: 34px;
    }

    .problem-item {
        font-size: 28px;
    }

    .hero-image,
    .about-image,
    .office-image {
        height: 340px;
    }

    .trust-card,
    .direction-card,
    .price-card,
    .contact-card {
        padding: 22px;
    }

    .footer-center h2 {
        font-size: 40px;
    }

    .footer-phone {
        font-size: 26px;
    }
}
@media(max-width:1024px){

    .process-grid{

        grid-template-columns:repeat(2,1fr);

    }

}

@media(max-width:768px){

    .process-grid{

        grid-template-columns:1fr;

    }

}
/* =========================
   PREMIUM SPACING SYSTEM
========================= */

.section{
    padding:180px 0;
}

.section-label{
    margin-bottom:24px;
}

.section-title{
    margin-bottom:60px;
}

p{
    line-height:1.9;
}
/* =========================
   UNIFIED CARD SYSTEM
========================= */

.card{
    background:white;
    border:1px solid var(--border);
    border-radius:32px;
    padding:40px;
    transition:.35s ease;
}

.card:hover{
    transform:translateY(-6px);
    box-shadow:0 20px 60px rgba(0,0,0,.06);
}
/* =========================
   PREMIUM TYPOGRAPHY FIX
========================= */

h1,h2,h3{
    letter-spacing:-0.03em;
}

.section-title{
    font-weight:400;
}

body{
    -webkit-font-smoothing:antialiased;
}
/* =========================
   SMOOTH REVEAL (PREMIUM FEEL)
========================= */

.reveal{
    opacity:0;
    transform:translateY(30px);
    transition:all .9s cubic-bezier(.2,.8,.2,1);
}

.reveal.active{
    opacity:1;
    transform:translateY(0);
}
/* =========================
   SOFT HOVER SYSTEM
========================= */

.card,
.btn,
.hero-image img{
    transition:all .6s cubic-bezier(.2,.8,.2,1);
}

.card:hover{
    transform:translateY(-8px);
}
/* =========================
   TYPOGRAPHY POLISH
========================= */

p{
    color:rgba(47,47,47,.78);
}

.section-title{
    max-width:900px;
}

.section-label{
    letter-spacing:.22em;
    opacity:.7;
}
/* =========================
   LUXURY SPACING
========================= */

.hero{
    padding-top:140px;
}

.section{
    padding:200px 0;
}

.trust,
.problems{
    padding:200px 0;
}
/* =========================
   MICRO INTERACTION
========================= */

a{
    transition:.3s ease;
}

a:hover{
    opacity:.7;
}
/* =========================
   TYPOGRAPHY SYSTEM (FINAL)
========================= */

body{
    font-size:18px;
    line-height:1.75;
}

h1{
    letter-spacing:-0.04em;
}

h2{
    letter-spacing:-0.03em;
}

p{
    max-width:65ch;
}
/* =========================
   PREMIUM WHITE SPACE
========================= */

.section:nth-child(even){
    background:rgba(255,255,255,0.35);
}

.section{
    position:relative;
}
/* =========================
   EDITORIAL TEXT FEEL
========================= */

.section-title{
    font-weight:400;
    line-height:1.05;
}

.section-label{
    font-size:11px;
    opacity:.6;
}
/* =========================
   SOFT UI FINISH
========================= */

.card,
.contact-card,
.direction-card,
.review-card,
.process-card{
    box-shadow:0 10px 40px rgba(0,0,0,.04);
}

img{
    filter:saturate(0.95);
}
/* =========================
   IMAGE LUXURY BEHAVIOR
========================= */

.hero-image img,
.about-image img,
.office-image{
    transition:transform 1.2s ease;
}

.hero-image:hover img{
    transform:scale(1.04);
}
/* =========================
   EDITORIAL GRID SYSTEM
========================= */

.container{
    max-width:1200px;
}

.section{
    display:flex;
    justify-content:center;
}

.section > .container{
    width:100%;
}
/* =========================
   LUXURY SPACING 10/10
========================= */

.section{
    padding:220px 0;
}

/*.section + .section{
    margin-top:-40px;
}*/
/* =========================
   TYPOGRAPHY FINAL
========================= */

body{
    font-size:18px;
    line-height:1.8;
    color:rgba(47,47,47,.82);
}

p{
    max-width:68ch;
}

h1,h2,h3{
    letter-spacing:-0.04em;
    font-weight:400;
}
/* =========================
   HERO FINAL LAYOUT
========================= */

.hero{
    min-height:100vh;
    display:flex;
    align-items:center;
}

.hero-grid{
    align-items:center;
}

.hero h1{
    font-size:clamp(64px,7vw,110px);
    line-height:.9;
}
/* =========================
   PREMIUM IMAGE SYSTEM
========================= */

img{
    filter:contrast(1.02) saturate(0.95);
}

.hero-image{
    border-radius:48px;
    overflow:hidden;
}

.hero-image img{
    transform:scale(1.02);
}
/* =========================
   NOISE REDUCTION
========================= */

.card{
    background:rgba(255,255,255,.8);
    backdrop-filter:blur(10px);
}

a{
    opacity:.85;
}

a:hover{
    opacity:1;
}
/* =========================
   SMOOTH SYSTEM FINAL
========================= */

.card:hover{
    transform:translateY(-10px);
}
/* =========================
   STICKY CTA (CONVERSION BOOST)
========================= */

.sticky-cta{

    position:fixed;

    bottom:20px;

    left:50%;

    transform:translateX(-50%);

    background:rgba(123,106,89,.95);

    padding:14px 22px;

    border-radius:999px;

    backdrop-filter:blur(10px);

    z-index:9999;
    
   transition:
        opacity .45s ease,
        transform .45s cubic-bezier(.22,.61,.36,1);

}

.sticky-cta a{

    color:white;

    font-size:14px;

    letter-spacing:.02em;

}
/* =========================
   TRUST PSYCHOLOGY BOOST
========================= */

.trust-card h3{
    font-size:48px;
}

.trust-card p{
    font-size:16px;
    opacity:.8;
}
/* =========================
   CONTACT CONVERSION FIX
========================= */

.contact-card{
    box-shadow:0 30px 80px rgba(0,0,0,.06);
}

.contact-card button{
    font-weight:500;
    letter-spacing:.02em;
}
/* =========================
   FOCUS SYSTEM
========================= */

.section{
    position:relative;
}

.section::before{
    content:"";
    position:absolute;
    inset:0;
    pointer-events:none;
}
/* =========================
   SOLUTION BLOCK (CONVERSION CORE)
========================= */

.solution{
    padding:160px 0;
    text-align:center;
}

.solution h2{
    font-family:"Instrument Serif",serif;
    font-size:clamp(48px,6vw,86px);
    font-weight:400;
    letter-spacing:-0.03em;
    margin-bottom:30px;
}

.solution p{
    max-width:720px;
    margin:0 auto;
    font-size:20px;
    line-height:1.9;
    color:rgba(47,47,47,.75);
}
.solution-grid {
    margin-top: 60px;

    display: grid;
    grid-template-columns: repeat(2, 1fr);

    gap: 20px 60px;
}

.solution-grid div {
    padding-bottom: 20px;

    border-bottom: 1px solid rgba(0,0,0,.08);

    font-size: 24px;

    font-family: "Instrument Serif", serif;
}

@media (max-width:768px) {

    .solution-grid {
        grid-template-columns: 1fr;
    }

}
/* =========================
   TRUST UPGRADE
========================= */

.trust{
    background:rgba(255,255,255,.4);
}

.trust-card{
    background:rgba(255,255,255,.7);
    backdrop-filter:blur(10px);
}
/* =========================
   INVISIBLE UI SYSTEM
========================= */

.card{
    border:1px solid rgba(221,213,203,.7);
}

.section-label{
    opacity:.55;
}
/* =========================
   MID CTA (HIGH CONVERSION)
========================= */

.mid-cta{
    padding:200px 0;
    text-align:center;
}

.mid-cta h2{
    font-family:"Instrument Serif",serif;
    font-size:clamp(48px,6vw,88px);
    font-weight:400;
    margin-bottom:40px;
}

/* =========================
   LEVEL 10 — APPLE CLINIC EXPERIENCE SYSTEM
   FINAL FORM
========================= */

/* 1. ПОЛНАЯ ЭМОЦИОНАЛЬНАЯ НЕЙТРАЛЬНОСТЬ (NO BRAND NOISE) */
body {
    background: #F7F4EF;
    color: rgba(47,47,47,.74);
    -webkit-font-smoothing: antialiased;
}

/* 2. СЕКЦИИ = “ГЛАВЫ РАЗГОВОРА” */
section {
    padding: clamp(150px, 12vw, 260px) 0;
    position: relative;
}

/* 3. МЯГКАЯ ГРАНИЦА РЕАЛЬНОСТИ */
section + section {
    border-top: 1px solid rgba(0,0,0,.03);
}

/* 4. ТИПОГРАФИКА УРОВНЯ APPLE HEALTH */
h1, h2 {
    letter-spacing: -0.05em;
    line-height: 1.01;
    font-weight: 400;
}

/* 5. ТЕКСТ = ПСИХОЛОГИЧЕСКАЯ БЕЗОПАСНОСТЬ */
p {
    max-width: 58ch;
    line-height: 1.95;
    font-size: 18px;
    color: rgba(47,47,47,.68);
}

/* 6. КАРТОЧКИ = “ФИЗИЧЕСКОЕ ПРИСУТСТВИЕ” */
.card,
.trust-card,
.direction-card,
.process-card,
.contact-card {
    background: rgba(255,255,255,.88);
    border: 1px solid rgba(221,213,203,.32);
    border-radius: 44px;
    backdrop-filter: blur(22px);
    box-shadow: 0 26px 90px rgba(0,0,0,.028);
}

/* 7. HOVER = “ГРАВИТАЦИЯ” (НЕ ДРАМА) */
.card:hover,
.direction-card:hover,
.process-card:hover {
    transform: translateY(-3px);
    transition: all .95s cubic-bezier(.2,.8,.2,1);
}

/* 8. CTA = СПОКОЙНОЕ ПРИГЛАШЕНИЕ */
.btn {
    background: rgba(123,106,89,.82);
    box-shadow: 0 14px 60px rgba(123,106,89,.10);
    transition: all .9s cubic-bezier(.2,.8,.2,1);
}

.btn:hover {
    transform: translateY(-2px);
    box-shadow: 0 22px 80px rgba(123,106,89,.14);
}

/* 9. ВИЗУАЛЬНАЯ ДЕ-АГРЕССИЯ */
img {
    filter: contrast(1.01) saturate(0.82);
}

/* 10. ФОКУС ВНИМАНИЯ (EDITORIAL FLOW) */
.section-title {
    max-width: 820px;
    margin-bottom: 64px;
}

/* 11. СНИЖЕНИЕ КОГНИТИВНОЙ НАГРУЗКИ */
* {
    scroll-behavior: smooth;
}

/* 12. MOBILE — КЛИНИЧЕСКАЯ ЧИТАЕМОСТЬ */
@media (max-width: 768px) {

    .section {
        padding: 60px 0;
    }

    h1 {
        font-size: 40px;
    }

    .btn {
        width: 100%;
        text-align: center;
    }

    .card,
    .trust-card,
    .direction-card,
    .process-card {
        border-radius: 28px;
    }
}

/* 13. FINAL RULE — “NO DISTRACTION PRINCIPLE” */
a:hover {
    opacity: .92;
}
.about-content p,
.office-content p,
.contact-left p {
    max-width: 52ch;
}

.hero-image,
.about-image {
    position: relative;
}

.hero-image::after,
.about-image::after {
    content: "";
    position: absolute;
    inset: 0;

    border-radius: inherit;

    box-shadow:
        inset 0 0 0 1px rgba(255,255,255,.35),
        0 30px 80px rgba(0,0,0,.06);

    pointer-events: none;
}
.about-content {
    max-width: 560px;
}

.about-content p {
    font-size: 20px;
    line-height: 1.9;
}
.trust-card,
.direction-card,
.process-card {
    transition:
        transform .35s ease,
        box-shadow .35s ease;
}

.trust-card:hover,
.direction-card:hover,
.process-card:hover {
    transform: translateY(-4px);

    box-shadow:
        0 18px 50px rgba(0,0,0,.05);
}

/* =========================
   PRICING
========================= */

.pricing-grid {
    margin-top: 60px;

    display: grid;
    grid-template-columns: repeat(2, 1fr);

    gap: 24px;
}

.pricing-card {
    background: rgba(255,255,255,.65);

    border: 1px solid var(--border);

    border-radius: 32px;

    padding: 48px;
}

.pricing-name {
    font-size: 18px;

    margin-bottom: 24px;

    color: var(--text-light);
}

.pricing-price {
    font-family: "Instrument Serif", serif;

    font-size: clamp(48px,5vw,72px);

    line-height: 1;
}

.pricing-duration {
    margin-top: 20px;

    color: var(--text-light);
}

.pricing-card.featured {
    border-color: rgba(123,106,89,.35);

    background:
        linear-gradient(
            180deg,
            rgba(255,255,255,.85),
            rgba(255,255,255,.65)
        );
}

@media (max-width:768px) {

    .pricing-grid {
        grid-template-columns: 1fr;
    }

}

/* =========================
   SOLUTION PREMIUM
========================= */

.solution-layout {

    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 100px;
    align-items: center;

}

.solution-image {

    height: 760px;
    border-radius: 40px;
    overflow: hidden;
    position: relative;

}

.solution-image img {

    width: 100%;
    height: 100%;
    object-fit: cover;

}

.solution-image::after {

    content: "";
    position: absolute;
    inset: 0;

    border-radius: inherit;

    box-shadow:
        inset 0 0 0 1px rgba(255,255,255,.35),
        0 30px 80px rgba(0,0,0,.06);

    pointer-events: none;

}

.solution-content h2 {

    font-family: "Instrument Serif", serif;
    font-size: clamp(48px,6vw,82px);
    font-weight: 400;
    line-height: .95;
    letter-spacing: -.04em;

    margin-bottom: 30px;

}

.solution-content p {

    margin-bottom: 50px;

}

.solution-grid {

    display: grid;
    grid-template-columns: repeat(2,1fr);
    gap: 20px 40px;

}

.solution-grid div {

    padding-bottom: 16px;

    border-bottom: 1px solid rgba(0,0,0,.08);

    font-family: "Instrument Serif", serif;
    font-size: 24px;

}

@media (max-width:1024px){

    .solution-layout{

        grid-template-columns:1fr;
        gap:60px;

    }

    .solution-image{

        height:500px;

    }

}

@media (max-width:768px){

    .solution-grid{

        grid-template-columns:1fr;

    }

}
.about-badges{
    display:flex;
    flex-wrap:wrap;
    gap:10px;
    margin-bottom:24px;
}

.about-badges span{
    padding:8px 14px;
    border-radius:999px;
    border:1px solid rgba(123,106,89,.15);
    background:rgba(255,255,255,.6);
    font-size:13px;
}

.pricing-card{
    padding:60px;
}

.pricing-price{
    font-size:72px;
}

.pricing-name{
    font-size:20px;
}
.hidden-block {
    opacity: 0;
    transform: translateY(30px);
    transition: .8s;
}

.visible {
    opacity: 1;
    transform: translateY(0);
}

.success-message {
    padding: 50px;
    border: 1px solid var(--border);
    border-radius: 30px;
    text-align: center;
}

.success-message h3 {
    font-family: "Instrument Serif", serif;
    font-size: 48px;
    font-weight: 400;
    margin-bottom: 20px;
}

.success-message p {
    color: var(--text-light);
}
@media (max-width:768px){

    .hero-image,
    .about-image,
    .solution-image,
    .office-image{

        height:auto;

    }
    .footer-socials a {
    font-size: 32px;
    padding: 0 25px;
    }
    .sticky-cta a{
        font-size: 10px;
    }
    section {
    padding: 60px 2%!important;
}
    .section > .container{
    width:92%;
}
}
.reveal {
    opacity: 0;
    transform: translateY(24px);
    transition:
        opacity 1s ease,
        transform 1s ease;
}

.reveal.visible {
    opacity: 1;
    transform: translateY(0);
}
.hero-title {
    animation: heroFade 1.2s ease forwards;
}

@keyframes heroFade {

    from {
        opacity: 0;
        transform: translateY(12px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }

}
.hero-image img,
.about-image img {

    transition:
        transform 8s ease;

}

.hero:hover .hero-image img,
.about:hover .about-image img {

    transform: scale(1.04);

}
.section-label {

    display:flex;
    align-items:center;
    gap:12px;

}

.section-label::before {

    content:"";

    width:32px;
    height:1px;

    background:rgba(123,106,89,.35);

}
body::before {

    content:"";

    position:fixed;
    inset:0;

    background-image:
        radial-gradient(
            rgba(0,0,0,.015) 1px,
            transparent 1px
        );

    background-size:12px 12px;

    pointer-events:none;

    opacity:.25;

}
.section-label::before {

    transform-origin:left;
    transform:scaleX(0);

    animation:lineGrow 1s ease forwards;

}

@keyframes lineGrow {

    to {
        transform:scaleX(1);
    }

}
body {

    background:
        radial-gradient(
            circle at top left,
            rgba(255,255,255,.7),
            transparent 40%
        ),
        var(--bg);

}
.hero-note{

    margin-top:20px;

    font-size:14px;

    letter-spacing:.08em;

    text-transform:uppercase;

    color:rgba(47,47,47,.45);

}
.trust-value {

    font-family: "Instrument Serif", serif;

    font-size: clamp(34px, 3vw, 42px);

    line-height: 1;

    letter-spacing: -0.04em;

    color: var(--accent);

    margin-bottom: 24px;

}
.trust-card::before {

    content: "";

    display: block;

    width: 40px;

    height: 1px;

    background: rgba(123,106,89,.35);

    margin-bottom: 24px;

}
.trust-value {

    font-family: "Instrument Serif", serif;
    font-size: 27px;

}

.trust-value.text {

    font-size: 34px;

}

/*==================================================
PREMIUM REVIEWS
==================================================*/

.reviews-premium{

position:relative;

overflow:hidden;

padding:140px 0;

background:

    radial-gradient(
        circle at 0% 0%,
        rgba(212,196,180,.20),
        transparent 45%
    ),

    radial-gradient(
        circle at 100% 100%,
        rgba(255,255,255,.95),
        transparent 50%
    ),

    #F8F5F1;


}

/*--------------------*/

.reviews-header{


max-width:760px;

margin:0 auto 80px;

text-align:center;


}

.reviews-subtitle{


max-width:620px;

margin:24px auto 0;

font-size:20px;

line-height:1.9;

color:#7B726A;


}

/*--------------------*/

.reviews-marquee{


overflow:hidden;

position:relative;


}

/* плавные края */

.reviews-marquee::before,

.reviews-marquee::after{


content:"";

position:absolute;

top:0;

width:180px;

height:100%;

z-index:30;

pointer-events:none;


}

.reviews-marquee::before{


left:0;

background:

    linear-gradient(
        to right,
        #F8F5F1,
        transparent
    );


}

.reviews-marquee::after{


right:0;

background:

    linear-gradient(
        to left,
        #F8F5F1,
        transparent
    );


}

/*--------------------*/

.reviews-track{

    display:flex;

    gap:34px;

    width:max-content;

    will-change:transform;

    cursor:grab;

    user-select:none;

}

.reviews-track:active{

    cursor:grabbing;

}

.reviews-marquee:hover

.reviews-track{


animation-play-state:paused;


}

/*--------------------*/

.review-card-premium{

width:540px;

min-height:420px;

flex:none;

padding:48px;

border-radius:34px;

background:

    rgba(255,255,255,.76);

backdrop-filter:

    blur(18px);

border:

    1px solid

    rgba(255,255,255,.8);

box-shadow:

    0 12px 50px

    rgba(20,20,20,.06);

transition:

    .45s cubic-bezier(.22,.61,.36,1);

position:relative;

}

.review-card-premium:hover{

transform:

    translateY(-10px)

    scale(1.02);

box-shadow:

    0 40px 90px

    rgba(0,0,0,.09);

}

/*--------------------*/

.review-quote{

position:absolute;

top:18px;

left:36px;

font-family:

    "Instrument Serif",
    serif;

font-size:140px;

line-height:1;

color:

    rgba(198,180,165,.28);

}

/*--------------------*/

.review-content{

position:relative;

z-index:5;

margin-top:46px;

}

.review-content p{

font-size:20px;

line-height:1.95;

color:#3A3633;

}

/*--------------------*/

.review-footer{

margin-top:36px;

padding-top:26px;

border-top:

    1px solid

    #ECE6E0;

}

.review-stars{

color:#B89572;

letter-spacing:5px;

font-size:18px;

margin-bottom:14px;

}

.review-author{

color:#8E847C;

font-size:15px;

letter-spacing:.08em;

text-transform:uppercase;

}

/*--------------------*/

.reviews-note{

margin-top:70px;

text-align:center;

color:#8B827B;

font-size:15px;

line-height:1.8;

}

/*--------------------*/



/*--------------------*/

@media(max-width:991px){

.reviews-premium{

    padding:100px 0;

}

.review-card-premium{

    width:420px;

    min-height:390px;

    padding:36px;

}

}

@media(max-width:768px){

.reviews-header{

    margin-bottom:55px;

}

.reviews-subtitle{

    font-size:17px;

}

.review-card-premium{

    width:88vw;

    min-height:auto;

    padding:30px;

}

.review-content p{

    font-size:17px;

    line-height:1.8;

}

.review-quote{

    font-size:90px;

    left:24px;

}

.reviews-marquee::before,

.reviews-marquee::after{

    width:50px;

}

}

/*==================================================
        REVIEW PREMIUM HOVER
==================================================*/

.reviews-track:hover .review-card-premium{

    opacity:.45;

    transform:scale(.96);

    filter:blur(.4px);

}

.review-card-premium{

    position:relative;

    overflow:hidden;

    transition:

        transform .55s cubic-bezier(.22,.61,.36,1),

        opacity .45s,

        filter .45s,

        box-shadow .55s;

}

/* Световое пятно */

.review-card-premium::before{

    content:"";

    position:absolute;

    inset:-40%;

    background:

        radial-gradient(

            circle,

            rgba(255,255,255,.45),

            transparent 65%

        );

    opacity:0;

    transition:.6s;

    transform:translate(-35%,-35%);

}

/* стеклянный блик */

.review-card-premium::after{

    content:"";

    position:absolute;

    left:-140%;

    top:0;

    width:60%;

    height:100%;

    background:

        linear-gradient(

            115deg,

            transparent,

            rgba(255,255,255,.35),

            transparent

        );

    transition:1s;

}

.review-card-premium:hover{

    opacity:1 !important;

    filter:none !important;

    transform:

        translateY(-12px)

        scale(1.03);

    box-shadow:

        0 45px 120px rgba(0,0,0,.10);

}

.review-card-premium:hover::before{

    opacity:1;

}

.review-card-premium:hover::after{

    left:180%;

}

/*=========================
    AUTHOR
=========================*/

.footer-author{

    display:flex;
    align-items:center;
    gap:10px;

    font-size:13px;

    letter-spacing:.08em;

}

.footer-author-label{

    color:rgba(255,255,255,.42);

    text-transform:uppercase;

}

.footer-author-name{

    position:relative;

    color:#d7c0aa;

    font-weight:600;

    letter-spacing:.12em;

    transition:
        color .35s ease,
        transform .35s ease;

}

.footer-author-name::after{

    content:"";

    position:absolute;

    left:0;
    bottom:-4px;

    width:0;
    height:1px;

    background:#d7c0aa;

    transition:.35s;

}

.footer-author-name:hover{

    color:#ffffff;

    transform:translateY(-1px);

}

.footer-author-name:hover::after{

    width:100%;

}

/*==================================
      APPLE SHEET
==================================*/

.sheet{

    position:fixed;

    inset:0;

    z-index:99999;

    visibility:hidden;

    opacity:0;

    transition:.45s;

}

.sheet.active{

    visibility:visible;

    opacity:1;

}

/*=====================*/

.sheet-overlay{

    position:absolute;

    inset:0;

    background:rgba(20,20,20,.35);

    backdrop-filter:blur(18px);

}

/*=====================*/

.sheet-window{

    position:absolute;

    left:50%;

    bottom:0;

    transform:

        translateX(-50%)

        translateY(110%);

    width:min(980px,96vw);

    height:min(86vh,900px);

    background:

        rgba(255,255,255,.86);

    backdrop-filter:blur(35px);

    border-radius:

        34px 34px 0 0;

    overflow:hidden;

    transition:

        transform

        .65s

        cubic-bezier(.22,.61,.18,1);

    box-shadow:

        0 -20px 80px

        rgba(0,0,0,.18);

}

.sheet.active

.sheet-window{

    transform:

        translateX(-50%)

        translateY(0);

}

/*=====================*/

.sheet-handle{

    width:70px;

    height:6px;

    border-radius:999px;

    background:#D5D5D5;

    margin:18px auto;

}

/*=====================*/

.sheet-content{

    height:calc(100% - 42px);

    overflow:auto;

    padding:

        30px

        60px

        80px;

}

/*=====================*/

.sheet-close{

    position:absolute;

    right:20px;

    top:18px;

    width:44px;

    height:44px;

    border:none;

    border-radius:50%;

    background:white;

    color:#444;

    cursor:pointer;

    transition:.35s;

}

.sheet-close:hover{

    background:#f0f0f0;

    transform:rotate(90deg);

}

/*=====================*/

.sheet-content::-webkit-scrollbar{

    width:8px;

}

.sheet-content::-webkit-scrollbar-thumb{

    background:#d0c6bc;

    border-radius:20px;

}

.sheet-content h1{

    font-family:

        "Instrument Serif";

    font-size:58px;

    margin-bottom:25px;

}

.sheet-content h2{

    margin-top:50px;

    margin-bottom:18px;

}

.sheet-content p,

.sheet-content li{

    line-height:1.9;

    color:#555;

}

.sheet-content ul{

    padding-left:24px;

}

/*=====================*/

@media(max-width:768px){

.sheet-window{

    width:100vw;

    height:100vh;

    border-radius:26px 26px 0 0;

}

.sheet-content{

    padding:

        20px

        26px

        60px;

}

.sheet-content h1{

    font-size:42px;

}

}

/*==================================
        PRIVACY
==================================*/

.policy-date{

    color:#9B9188;

    margin-bottom:40px;

    font-size:15px;

}

.policy-lead{

    font-size:22px;

    line-height:2;

    color:#555;

    max-width:850px;

}

.sheet-content hr{

    border:none;

    border-top:1px solid #ECE5DD;

    margin:50px 0;

}

.sheet-content h2{

    font-family:"Instrument Serif",serif;

    font-size:36px;

    margin-bottom:24px;

    font-weight:400;

}

.sheet-content ul{

    margin:20px 0 0 24px;

}

.sheet-content li{

    margin-bottom:14px;

}

.policy-footer{

    margin-top:70px;

    padding:35px;

    border-radius:24px;

    background:#F6F3EF;

    font-family:"Instrument Serif",serif;

    font-size:30px;

    line-height:1.4;

    color:#7B6A59;

    text-align:center;

}

/*==================================
        POLICY LOADER
==================================*/

.policy-loading{

    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;

    min-height:300px;

    gap:24px;

}

.loader{

    width:42px;
    height:42px;

    border:2px solid rgba(0,0,0,.08);

    border-top:2px solid #9E856F;

    border-radius:50%;

    animation:spin .7s linear infinite;

}

@keyframes spin{

    to{

        transform:rotate(360deg);

    }

}

/*==================================
        COOKIE BANNER
==================================*/

.cookie-banner{

    position:fixed;

    left:50%;

    bottom:24px;

    transform:
        translateX(-50%)
        translateY(120px);

    width:min(760px,calc(100vw - 32px));

    background:rgba(255,255,255,.82);

    backdrop-filter:blur(24px);

    border:1px solid rgba(255,255,255,.55);

    border-radius:24px;

    box-shadow:
        0 25px 80px rgba(0,0,0,.12);

    opacity:0;

    visibility:hidden;

    transition:
        transform .55s cubic-bezier(.22,.61,.36,1),
        opacity .45s;

    z-index:9998;

}

.cookie-banner.show{

    opacity:1;

    visibility:visible;

    transform:
        translateX(-50%)
        translateY(0);

}

.cookie-content{

    display:flex;

    align-items:center;

    gap:24px;

    padding:22px 28px;

}

.cookie-icon{

    font-size:34px;

    flex-shrink:0;

}

.cookie-text{

    flex:1;

}

.cookie-text h3{

    margin:0 0 6px;

    font-family:"Instrument Serif",serif;

    font-size:28px;

    font-weight:400;

}

.cookie-text p{

    margin:0;

    color:#666;

    line-height:1.6;

    font-size:15px;

}

.cookie-buttons{

    display:flex;

    gap:12px;

}

.cookie-more,

.cookie-accept{

    border:none;

    cursor:pointer;

    border-radius:14px;

    padding:13px 22px;

    font-size:15px;

    transition:.3s;

}

.cookie-more{

    background:#F2EEE8;

    color:#7B6A59;

}

.cookie-more:hover{

    background:#E8E0D8;

}

.cookie-accept{

    background:#7B6A59;

    color:white;

}

.cookie-accept:hover{

    transform:translateY(-2px);

    box-shadow:0 10px 25px rgba(123,106,89,.25);

}

@media(max-width:768px){

.cookie-content{

    flex-direction:column;

    align-items:flex-start;

    gap:18px;

}

.cookie-buttons{

    width:100%;

}

.cookie-more,

.cookie-accept{

    flex:1;

}

}

/*==================================
        PRIVACY CHECKBOX
==================================*/

.privacy-check{

    display:flex;

    align-items:flex-start;

    gap:14px;

    margin:22px 0 28px;

    cursor:pointer;

    user-select:none;

}

.privacy-check input{

    display:none;

}

/*========================*/

.checkmark{

    width:22px;

    height:22px;

    min-width:22px;

    border-radius:8px;

    border:1.5px solid rgba(123,106,89,.35);

    background:rgba(255,255,255,.7);

    position:relative;

    transition:
        all .35s cubic-bezier(.22,.61,.36,1);

    margin-top:2px;

}

/*========================*/

.checkmark::after{

    content:"";

    position:absolute;

    left:6px;

    top:2px;

    width:6px;

    height:11px;

    border-right:2px solid white;

    border-bottom:2px solid white;

    transform:
        rotate(45deg)
        scale(0);

    transition:
        transform .28s ease;

}

/*========================*/

.privacy-check input:checked
+ .checkmark{

    background:#7B6A59;

    border-color:#7B6A59;

    box-shadow:

        0 8px 18px rgba(123,106,89,.25);

}

.privacy-check input:checked
+ .checkmark::after{

    transform:
        rotate(45deg)
        scale(1);

}

/*========================*/

.privacy-text{

    font-size:14px;

    line-height:1.7;

    color:#6C665F;

}

/*========================*/

.privacy-text a{

    color:#7B6A59;

    text-decoration:none;

    position:relative;

    transition:.3s;

}

/* линия */

.privacy-text a::after{

    content:"";

    position:absolute;

    left:0;

    bottom:-2px;

    width:0;

    height:1px;

    background:#7B6A59;

    transition:.35s;

}

.privacy-text a:hover{

    color:#4D4136;

}

.privacy-text a:hover::after{

    width:100%;

}

/*========================*/

/* красивый focus */

.privacy-check input:focus
+ .checkmark{

    outline:3px solid rgba(123,106,89,.15);

    outline-offset:3px;

}

/*========================*/

@media(max-width:768px){

.privacy-check{

    gap:12px;

}

.privacy-text{

    font-size:13px;

    line-height:1.6;

}

}