@font-face {
    font-family: Furnidesk;
    src: local("Inter"), local("Aptos"), local("Arial");
    font-display: swap;
}
* {
    box-sizing: border-box;
}
html {
    scroll-behavior: smooth;
    scroll-padding-top: 110px;
}
body {
    margin: 0;
    background: #faf7f2;
    color: #242321;
    font-family: Furnidesk, Arial, sans-serif;
    font-size: 16px;
    line-height: 1.6;
}
a {
    color: inherit;
    text-decoration: none;
}
button,
input,
select {
    font: inherit;
}
button,
summary {
    cursor: pointer;
}
img {
    max-width: 100%;
    height: auto;
}
h1,
h2,
h3,
p {
    margin-top: 0;
}
h1,
h2,
h3 {
    line-height: 1.12;
    letter-spacing: -0.045em;
}
h1 {
    font-size: clamp(42px, 5vw, 76px);
    font-weight: 700;
    margin-bottom: 28px;
}
h2 {
    font-size: clamp(30px, 3.2vw, 46px);
    font-weight: 650;
}
h3 {
    font-size: 24px;
    letter-spacing: -0.025em;
}
p {
    color: #69645e;
}
a,
button,
input,
select,
summary {
    touch-action: manipulation;
}
a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible,
summary:focus-visible,
div[tabindex]:focus-visible {
    outline: 3px solid #e45b35;
    outline-offset: 4px;
}
::selection {
    background: #ddbda2;
    background: #ddbda2;
}
.skip {
    position: fixed;
    top: -100px;
    inset-inline-start: 16px;
    background: #242321;
    color: white;
    padding: 12px;
    z-index: 100;
}
.skip:focus {
    top: 12px;
}
.site-header {
    max-width: 1480px;
    margin: auto;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 30px;
    padding: 27px 44px;
    border-bottom: 1px solid #e5dfd7;
}
.logo {
    display: block;
    flex-shrink: 0;
}
.logo img {
    width: 177px;
    display: block;
}
.site-header nav {
    display: flex;
    align-items: center;
    gap: 24px;
    font-size: 14px;
    font-weight: 600;
}
.site-header nav > a:hover,
summary:hover {
    color: #e45b35;
}
.site-header details {
    position: relative;
}
.site-header summary {
    list-style: none;
    display: flex;
    gap: 6px;
    align-items: center;
}
.site-header summary::-webkit-details-marker {
    display: none;
}
.site-header summary:after {
    content: none;
}
.site-header details > div {
    position: absolute;
    top: 32px;
    inset-inline-end: 0;
    min-width: 235px;
    background: white;
    padding: 14px;
    border: 1px solid #eae5dd;
    border-radius: 14px;
    box-shadow: 0 15px 35px #24232117;
    z-index: 20;
}
.site-header details a {
    display: block;
    padding: 8px 10px;
    border-radius: 6px;
    font-weight: 400;
}
.site-header details a:hover,
.site-header details a[aria-current] {
    background: #faf7f2;
    color: #cc4824;
}
.login {
    border: 1px solid #d7cfc5;
    border-radius: 7px;
    padding: 10px 16px;
    white-space: nowrap;
}
.menu-toggle {
    display: none;
}
.hero {
    max-width: 1480px;
    margin: auto;
    padding: 85px 64px 78px;
}
.home-hero {
    display: grid;
    grid-template-columns: 1fr 1fr;
    align-items: center;
    gap: 60px;
    min-height: 720px;
}
.eyebrow {
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.15em;
    color: #a36b53;
    text-transform: uppercase;
    line-height: 1.5;
}
.hero .eyebrow {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 24px;
}
.eyebrow > span {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: #e45b35;
}
.lead {
    font-size: 18px;
    line-height: 1.8;
    max-width: 640px;
}
.actions {
    display: flex;
    align-items: center;
    gap: 27px;
    margin-top: 32px;
    flex-wrap: wrap;
}
.button {
    display: inline-flex;
    align-items: center;
    justify-content: space-between;
    gap: 32px;
    padding: 16px 23px;
    color: white;
    background: #e45b35;
    border: 1px solid #e45b35;
    border-radius: 7px;
    font-size: 14px;
    font-weight: 600;
    transition: background 0.15s;
}
.button:hover {
    background: #c74626;
}
.button.secondary {
    background: transparent;
    color: #242321;
    border-color: #d5c7b9;
}
.text-link {
    font-size: 14px;
    font-weight: 600;
}
.hero-facts {
    display: flex;
    gap: 18px;
    flex-wrap: wrap;
    font-size: 12px;
    color: #756b60;
    margin-top: 30px;
}
.hero-facts span:before {
    content: "✓";
    color: #e45b35;
    margin-inline-end: 6px;
}
.workspace-art {
    position: relative;
    transform: rotate(-2deg);
    background: #fff;
    border: 1px solid #e6ded2;
    border-radius: 14px;
    box-shadow: 15px 35px 60px #6a51431a;
    min-width: 0;
}
.art-top {
    height: 48px;
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 0 17px;
    border-bottom: 1px solid #eee8e0;
    font-size: 12px;
}
.art-top > span:last-child {
    margin-inline-start: auto;
    font-size: 10px;
    color: #9b9187;
}
.art-dot {
    width: 9px;
    height: 9px;
    background: #e45b35;
    border-radius: 3px;
}
.art-content {
    display: grid;
    grid-template-columns: 108px 1fr;
    min-height: 380px;
}
.art-side {
    background: #f7f4ef;
    border-inline-end: 1px solid #eee8e0;
    padding: 23px 12px;
}
.art-side img {
    margin-bottom: 24px;
}
.art-side span {
    display: block;
    font-size: 9px;
    margin-bottom: 10px;
    padding: 8px 5px;
    border-radius: 5px;
    color: #81766c;
}
.art-side span:nth-child(3) {
    background: #f7e8df;
    color: #b44e30;
}
.art-main {
    padding: 28px 22px;
}
.art-main .eyebrow {
    font-size: 8px;
    margin-bottom: 9px;
}
.art-main h2 {
    font-size: 20px;
    max-width: 320px;
    letter-spacing: -0.03em;
}
.art-stats {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 9px;
}
.art-stats > div {
    background: #faf7f2;
    padding: 12px 10px;
    border-radius: 7px;
    min-width: 0;
}
.art-stats span {
    font-size: 8px;
    display: block;
    color: #81766c;
}
.art-stats b {
    font-size: 22px;
    font-weight: 500;
}
.sofa-scene {
    position: relative;
    height: 155px;
    margin: 10px 0;
    background: linear-gradient(160deg, #f2ebe2, #ddbda2);
    background: linear-gradient(160deg, #f2ebe2, #e5cfb8);
    border-radius: 8px;
    overflow: hidden;
}
.sofa-back {
    position: absolute;
    width: 62%;
    height: 68px;
    left: 19%;
    top: 35px;
    background: #bc7758;
    border-radius: 14px 14px 6px 6px;
    box-shadow: inset 0 -12px 0 #00000008;
    z-index: 2;
}
.sofa-seat {
    position: absolute;
    width: 66%;
    height: 30px;
    left: 17%;
    top: 90px;
    background: #cd8868;
    border-radius: 8px;
    box-shadow: 0 12px 20px #63412c35;
    z-index: 3;
}
.sofa-arm {
    position: absolute;
    width: 23px;
    height: 54px;
    top: 69px;
    background: #b56e50;
    border-radius: 8px;
    z-index: 4;
}
.sofa-arm.left {
    left: 15%;
}
.sofa-arm.right {
    right: 15%;
}
.sofa-leg {
    position: absolute;
    width: 7px;
    height: 17px;
    top: 115px;
    background: #514034;
    z-index: 2;
}
.sofa-leg.left {
    left: 20%;
}
.sofa-leg.right {
    right: 20%;
}
.scene-circle {
    position: absolute;
    right: -20px;
    top: -30px;
    width: 150px;
    height: 150px;
    border-radius: 50%;
    background: #fff4;
}
.art-progress {
    display: flex;
    align-items: center;
    gap: 7px;
    font-size: 8px;
    color: #86796d;
}
.art-progress i {
    height: 4px;
    flex: 1;
    background: #e45b35;
    border-radius: 5px;
}
.art-caption {
    display: block;
    text-align: center;
    padding: 10px;
    color: #978b7e;
    font-size: 9px;
    border-top: 1px solid #f0e8df;
}
.floating-note {
    position: absolute;
    bottom: 20px;
    inset-inline-end: -20px;
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 16px;
    background: #242321;
    color: white;
    border-radius: 10px;
    box-shadow: 0 10px 20px #24232120;
    transform: rotate(2deg);
    max-width: 90%;
}
.floating-note > span {
    color: #ddbda2;
    color: #ddbda2;
    background: #ffffff12;
    padding: 3px 10px;
    border-radius: 6px;
}
.floating-note b {
    font-size: 12px;
    font-weight: 500;
}
.floating-note small {
    font-size: 9px;
    display: block;
    color: #bfb4a6;
}
.inner-hero {
    padding-top: 72px;
    padding-bottom: 60px;
    max-width: 1280px;
}
.inner-hero h1 {
    max-width: 900px;
    font-size: clamp(40px, 4.5vw, 64px);
}
.inner-hero .lead {
    max-width: 850px;
}
.statement {
    max-width: 1352px;
    margin: auto;
    display: flex;
    justify-content: space-between;
    gap: 30px;
    border-top: 1px solid #ded5c9;
    border-bottom: 1px solid #ded5c9;
    padding: 26px 0;
    font-size: 13px;
    color: #8c8175;
}
.statement b {
    font-weight: 500;
    color: #514b43;
}
.content-section,
.modules-section,
.pricing-section {
    max-width: 1352px;
    margin: auto;
    padding: 78px 0;
}
.section-intro {
    max-width: 800px;
    margin-bottom: 38px;
}
.section-intro h2 {
    margin-bottom: 18px;
}
.feature-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 24px;
}
.feature-card {
    border-top: 1px solid #cfbdab;
    padding: 27px 4px;
}
.card-number {
    display: block;
    color: #c18367;
    font-size: 12px;
    margin-bottom: 23px;
    letter-spacing: 0.1em;
}
.feature-card p {
    font-size: 15px;
    line-height: 1.8;
}
.feature-card ul {
    padding-inline-start: 20px;
    color: #69645e;
    font-size: 14px;
}
.modules-section {
    border-top: 1px solid #e5dbcf;
}
.module-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 18px;
}
.module-card {
    background: #f0ebe3;
    border: 1px solid #e5dbce;
    border-radius: 12px;
    padding: 30px;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    transition:
        transform 0.2s,
        background 0.2s;
    min-width: 0;
}
.module-card:hover {
    transform: translateY(-4px);
    background: #ebe0d4;
}
.module-symbol {
    color: #c66a45;
    font-size: 31px;
    line-height: 1;
    margin-bottom: 24px;
}
.module-card h3 {
    font-size: 24px;
    line-height: 1.3;
}
.module-card p {
    font-size: 14px;
    line-height: 1.8;
}
.module-card b {
    font-weight: 500;
    font-size: 13px;
    margin-top: auto;
    color: #aa5737;
}
.pricing-section {
    border-top: 1px solid #e5dbcf;
}
.price-grid {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 14px;
    margin-top: 28px;
    margin-bottom: 28px;
}
.price-card {
    background: white;
    border: 1px solid #e3d9cc;
    border-radius: 10px;
    padding: 24px 20px;
    display: flex;
    flex-direction: column;
}
.price-card.featured {
    border-color: #e45b35;
    background: #fcf0e9;
}
.price-card h3 {
    font-size: 21px;
    line-height: 1.25;
    min-height: 54px;
}
.price {
    font-size: 36px;
    letter-spacing: -0.05em;
    font-weight: 600;
    margin-top: 15px;
    line-height: 1.3;
}
.price-period {
    font-size: 12px;
    color: #8a7c6d;
}
.annual-detail {
    font-size: 10px;
    color: #a15d40;
    margin-top: 6px;
}
.price-card p {
    font-size: 12px;
    line-height: 1.8;
    margin-top: 20px;
}
.price-card > a {
    margin-top: auto;
    font-size: 13px;
    color: #a65e3d;
}
.period-switch {
    padding: 0;
    border: 0;
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
}
.period-switch legend {
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
}
.period-switch label {
    padding: 10px 15px;
    background: #ede6dc;
    border: 1px solid #dfd1c3;
    border-radius: 7px;
    font-size: 13px;
    cursor: pointer;
    display: flex;
    align-items: center;
    gap: 8px;
}
.period-switch label:has(:checked) {
    background: #242321;
    color: white;
    border-color: #242321;
}
input[type="radio"],
input[type="checkbox"] {
    accent-color: #e45b35;
    width: 17px;
    height: 17px;
    margin: 0;
}
.calculator {
    margin-top: 65px;
    padding: 45px;
    background: #f0e8de;
    border: 1px solid #decfbe;
    border-radius: 14px;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 70px;
    scroll-margin-top: 20px;
}
.calculator h2 {
    font-size: 34px;
}
.calculator-fields {
    display: grid;
    gap: 20px;
}
.calculator-fields > label {
    display: flex;
    flex-direction: column;
    gap: 8px;
    font-size: 14px;
}
.calculator input[type="number"],
.calculator select {
    border: 1px solid #d4c4b2;
    background: #faf7f2;
    padding: 12px;
    border-radius: 6px;
    width: 100%;
    min-height: 48px;
}
.addon-fields {
    display: grid;
    gap: 10px;
    padding: 15px;
    border: 1px solid #d4c4b2;
    border-radius: 6px;
}
.addon-fields legend {
    font-size: 14px;
}
.addon-fields label {
    display: flex;
    gap: 10px;
    align-items: center;
    font-size: 14px;
}
.calculator small {
    font-size: 12px;
    color: #877666;
}
.calculator-total {
    padding: 35px;
    background: #242321;
    border-radius: 10px;
    color: #faf7f2;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
}
.calculator-total > span {
    color: #cfb39a;
    font-size: 13px;
}
.calculator-total output {
    font-size: clamp(36px, 4vw, 54px);
    line-height: 1.3;
    letter-spacing: -0.04em;
    font-weight: 600;
    margin-top: 10px;
    overflow-wrap: anywhere;
}
.calculator-total p {
    color: #c9bfb2;
    font-size: 13px;
}
.calculator-total small {
    color: #c9bfb2;
}
.calculator-total .button {
    margin: 16px 0 23px;
    gap: 10px;
}
.comparison {
    margin-top: 75px;
}
.comparison h2 {
    font-size: 32px;
}
.table-scroll {
    overflow-x: auto;
}
table {
    border-collapse: collapse;
    width: 100%;
    text-align: start;
    min-width: 480px;
    font-size: 14px;
}
th,
td {
    text-align: start;
    padding: 19px 20px;
    border-bottom: 1px solid #e1d6c8;
}
thead th {
    background: #f0e8de;
    font-weight: 600;
}
tbody th {
    font-weight: 500;
}
tbody td {
    color: #896951;
}
.faq-card {
    grid-column: 1/-1;
    border-bottom: 1px solid #dacbbb;
    padding: 24px 0;
}
.faq-card summary {
    font-size: 22px;
    font-weight: 500;
}
.faq-card p {
    max-width: 950px;
    margin: 20px 0 0;
    line-height: 1.8;
}
.contact-section {
    max-width: 1352px;
    margin: 0 auto 70px;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 70px;
    padding: 45px;
    background: #ece4d9;
    border-radius: 14px;
}
.contact-primary h2 {
    font-size: 32px;
}
.contact-primary > a {
    display: block;
    margin: 12px 0;
    color: #a55230;
}
.contact-section dt {
    font-size: 12px;
    color: #a1795c;
    margin-top: 22px;
}
.contact-section dd {
    margin: 5px 0;
    line-height: 1.8;
}
.closing {
    background: #242321;
    text-align: center;
    padding: 80px 25px;
    color: #faf7f2;
    margin-top: 35px;
}
.closing .eyebrow {
    color: #c39777;
}
.closing h2 {
    max-width: 780px;
    margin: 15px auto 30px;
}
.closing .actions {
    justify-content: center;
}
.closing .text-link {
    color: #dac0a9;
}
footer {
    max-width: 1352px;
    margin: auto;
    padding: 65px 0 25px;
    display: grid;
    grid-template-columns: 2fr 1fr 1fr;
    gap: 60px;
    font-size: 13px;
}
footer > div > b {
    display: block;
    font-size: 14px;
    margin-bottom: 16px;
}
footer > div > a {
    display: block;
    margin-top: 8px;
    color: #796d60;
}
.footer-brand p {
    max-width: 320px;
    margin: 20px 0 12px;
}
.footer-bottom {
    grid-column: 1/-1;
    border-top: 1px solid #ded3c6;
    padding-top: 24px;
    display: flex;
    justify-content: space-between;
    gap: 20px;
    color: #988a7b;
    font-size: 11px;
}
[dir="rtl"]h1,
[dir="rtl"]h2,
[dir="rtl"]h3 {
    letter-spacing: 0;
    line-height: 1.45;
}
[dir="rtl"]body {
    font-family: Tahoma, Arial, sans-serif;
}
[dir="rtl"].workspace-art {
    transform: rotate(2deg);
}
[dir="rtl"].floating-note {
    transform: rotate(-2deg);
}
[dir="rtl"].eyebrow {
    letter-spacing: 0.03em;
}
@media (min-width: 1500px) {
    .home-hero {
        gap: 80px;
    }
    .hero-copy {
        padding-inline-end: 15px;
    }
}
@media (max-width: 1400px) {
    .content-section,
    .modules-section,
    .pricing-section,
    .statement,
    footer,
    .contact-section {
        margin-inline: 44px;
    }
    .home-hero {
        gap: 35px;
        padding-inline: 44px;
    }
    .site-header nav {
        gap: 18px;
    }
    .nav-contact {
        display: none;
    }
    .home-hero h1 {
        font-size: 60px;
    }
    .price-card {
        padding: 22px 16px;
    }
    .price {
        font-size: 32px;
    }
}
@media (max-width: 1100px) {
    .site-header {
        padding: 22px 28px;
    }
    .site-header nav {
        gap: 13px;
        font-size: 12px;
    }
    .logo img {
        width: 148px;
    }
    .home-hero {
        padding: 65px 30px;
        gap: 28px;
        min-height: 650px;
    }
    .home-hero h1 {
        font-size: 49px;
    }
    .lead {
        font-size: 16px;
    }
    .art-content {
        grid-template-columns: 80px 1fr;
    }
    .art-main {
        padding: 23px 15px;
    }
    .art-main h2 {
        font-size: 18px;
    }
    .art-side {
        padding: 20px 6px;
    }
    .art-side span {
        font-size: 8px;
    }
    .floating-note {
        inset-inline-end: -5px;
    }
    .content-section,
    .modules-section,
    .pricing-section,
    .statement,
    footer,
    .contact-section {
        margin-inline: 30px;
    }
    .price-grid {
        grid-template-columns: repeat(3, 1fr);
    }
    .calculator {
        gap: 35px;
        padding: 30px;
    }
    .statement {
        flex-direction: column;
        gap: 8px;
    }
    .inner-hero {
        padding-inline: 30px;
    }
}
@media (max-width: 800px) {
    .site-header {
        position: relative;
        gap: 15px;
        padding: 22px;
    }
    .menu-toggle {
        display: block;
        background: transparent;
        border: 1px solid #d4c6b5;
        border-radius: 6px;
        padding: 7px 12px;
        font-size: 13px;
    }
    .site-header nav {
        display: none;
        position: absolute;
        top: 80px;
        left: 15px;
        right: 15px;
        background: #faf7f2;
        border: 1px solid #d4c6b5;
        padding: 24px;
        border-radius: 12px;
        z-index: 30;
        font-size: 15px;
        box-shadow: 0 20px 30px #24232115;
    }
    .site-header nav.open {
        display: flex;
        flex-direction: column;
        align-items: stretch;
        gap: 17px;
    }
    .site-header details > div {
        position: static;
        box-shadow: none;
        margin-top: 8px;
        min-width: 0;
    }
    .nav-contact {
        display: block;
    }
    .home-hero {
        grid-template-columns: 1fr;
        padding: 55px 24px 65px;
        gap: 45px;
    }
    .home-hero h1 {
        font-size: clamp(40px, 7vw, 58px);
    }
    .hero .lead {
        max-width: 600px;
    }
    .workspace-art {
        width: 90%;
        max-width: 580px;
        justify-self: center;
    }
    .hero-facts {
        gap: 13px;
    }
    .feature-grid,
    .module-grid {
        grid-template-columns: 1fr 1fr;
    }
    .feature-card:last-child {
        grid-column: 1/-1;
    }
    .content-section,
    .modules-section,
    .pricing-section {
        padding-block: 55px;
        margin-inline: 24px;
    }
    .statement {
        margin-inline: 24px;
    }
    .price-grid {
        grid-template-columns: 1fr 1fr;
    }
    .calculator {
        grid-template-columns: 1fr;
        gap: 30px;
    }
    .contact-section {
        grid-template-columns: 1fr;
        gap: 15px;
        margin-inline: 24px;
        padding: 30px;
    }
    .closing {
        padding-block: 60px;
    }
    footer {
        margin-inline: 24px;
        grid-template-columns: 1fr 1fr;
        gap: 35px;
    }
    .footer-brand {
        grid-column: 1/-1;
    }
    .footer-bottom {
        flex-direction: column;
        gap: 8px;
    }
}
@media (max-width: 480px) {
    .home-hero {
        padding-inline: 20px;
    }
    .hero-facts {
        font-size: 10px;
    }
    .hero .actions {
        gap: 22px;
    }
    .hero .button {
        padding: 14px 17px;
        gap: 16px;
    }
    .hero .text-link {
        font-size: 12px;
    }
    .hero .eyebrow {
        font-size: 9px;
    }
    .workspace-art {
        width: 96%;
    }
    .art-content {
        grid-template-columns: 66px 1fr;
        min-height: 320px;
    }
    .art-side span {
        font-size: 7px;
        line-height: 1.5;
        padding: 6px 2px;
    }
    .art-main {
        padding: 19px 12px;
    }
    .art-main h2 {
        font-size: 16px;
    }
    .art-stats span {
        font-size: 7px;
        overflow-wrap: anywhere;
    }
    .art-stats {
        gap: 5px;
    }
    .art-stats > div {
        padding: 9px 5px;
    }
    .art-stats b {
        font-size: 18px;
    }
    .art-progress {
        font-size: 7px;
    }
    .sofa-scene {
        height: 140px;
    }
    .floating-note {
        bottom: 13px;
        padding: 10px;
        max-width: 92%;
    }
    .floating-note b {
        font-size: 10px;
    }
    .feature-grid,
    .module-grid,
    .price-grid {
        grid-template-columns: 1fr;
    }
    .feature-card:last-child {
        grid-column: auto;
    }
    .feature-card {
        padding-bottom: 10px;
    }
    .module-card {
        padding: 25px;
    }
    .price-card h3 {
        min-height: 0;
    }
    .price-card {
        padding: 26px;
    }
    .price-card p {
        font-size: 14px;
    }
    .price {
        font-size: 42px;
    }
    .calculator {
        padding: 22px;
    }
    .calculator-total {
        padding: 24px;
    }
    .inner-hero {
        padding: 52px 24px 30px;
    }
    .inner-hero h1 {
        font-size: 38px;
    }
    .statement {
        font-size: 11px;
    }
    .footer-bottom {
        font-size: 10px;
    }
    h2 {
        font-size: 32px;
    }
    .closing h2 {
        font-size: 34px;
    }
}
@media (prefers-reduced-motion: reduce) {
    html {
        scroll-behavior: auto;
    }
    *,
    *:before,
    *:after {
        transition: none !important;
        animation: none !important;
    }
}

/* Navigation uses the same line icons on desktop and touch screens. */
.ui-icon { flex: 0 0 auto; vertical-align: middle; }
.site-header nav { gap: 18px; }
.site-header summary { gap: 8px; padding: 10px 0; min-height: 44px; }
.site-header summary .icon-chevron { width: 15px; height: 15px; opacity: .6; transition: transform .2s ease; }
.site-header details[open] > summary .icon-chevron { transform: rotate(180deg); }
.site-header summary .icon-globe { width: 18px; height: 18px; }
.site-header .module-dropdown { width: 660px; max-width: calc(100vw - 48px); inset-inline-start: -190px; inset-inline-end: auto; top: calc(100% + 10px); padding: 20px; border-radius: 20px; box-shadow: 0 20px 60px #2423211a; }
.dropdown-label { font-size: 11px; letter-spacing: .1em; text-transform: uppercase; color: #84756a; margin: 0 0 10px; padding-inline: 10px; font-weight: 700; }
.module-menu-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 5px; }
.site-header .module-menu-grid > a { display: flex; align-items: flex-start; gap: 12px; padding: 14px 10px; border-radius: 12px; }
.menu-module-icon { background: #f8f1e9; border: 1px solid #ece1d5; padding: 10px; border-radius: 12px; color: #bd5638; flex-shrink: 0; }
.menu-module-icon svg { width: 21px; height: 21px; }
.module-menu-grid strong { display: block; font-size: 14px; color: #242321; font-weight: 650; margin: 2px 0 5px; }
.module-menu-grid small { display: block; font-size: 12px; font-weight: 400; line-height: 1.55; color: #736c64; }
.module-menu-grid > a > .icon-arrow { width: 13px; height: 13px; margin-top: 5px; color: #bf593c; opacity: 0; }
.module-menu-grid > a:hover > .icon-arrow, .module-menu-grid > a:focus-visible > .icon-arrow { opacity: 1; }
.site-header .language-dropdown { min-width: 260px; padding: 16px; top: calc(100% + 10px); border-radius: 18px; }
.site-header .language-grid > a { display: flex; align-items: center; gap: 11px; padding: 10px; border-radius: 10px; font-size: 13px; }
.language-code { font-size: 10px; font-weight: 700; width: 29px; height: 25px; background: #f5f0ea; display: grid; place-items: center; border-radius: 6px; color: #766a5d; }
.language-grid .icon-check { margin-inline-start: auto; width: 15px; height: 15px; color: #c45232; }
.site-header nav > .login { display: inline-flex; gap: 8px; align-items: center; border: none; padding: 10px 0; }
.login .icon-arrow { width: 15px; height: 15px; }
.nav-signup { background: #e45b35; color: white; padding: 11px 15px; border-radius: 9px; white-space: nowrap; }
.site-header nav > .nav-signup:hover { color: white; background: #cc4824; }
.module-symbol svg { width: 27px; height: 27px; }
.purchase-existing { display: block; margin-top: 14px; text-decoration: underline; font-size: 13px; }
@media(max-width:1100px) and (min-width:801px) { .site-header { padding-inline: 24px; gap: 16px; } .site-header nav { gap: 12px; font-size: 12px; } .logo img { width: 150px; } .nav-signup { padding-inline: 10px; } .site-header .module-dropdown { width: 570px; inset-inline-start: -140px; } }
@media(max-width:800px) {
 .menu-toggle { display: flex; align-items: center; gap: 10px; border-radius: 10px; padding: 10px 12px; }
 .menu-toggle svg { width: 18px; height: 18px; }
 .site-header nav.open { gap: 4px; max-height: calc(100dvh - 110px); overflow-y: auto; padding: 16px; background: white; border-color: #eae5dd; border-radius: 18px; }
 .site-header nav > a { padding: 12px 10px; }
 .site-header summary { padding: 12px 10px; justify-content: space-between; }
 .site-header .language > summary { justify-content: flex-start; }
 .language > summary .icon-chevron { margin-inline-start: auto; }
 .site-header .module-dropdown, .site-header .language-dropdown { position: static; width: auto; max-width: none; min-width: 0; padding: 10px 4px; box-shadow: none; border-radius: 12px; background: #fcfaf7; }
 .module-menu-grid { grid-template-columns: 1fr; }
 .site-header .module-menu-grid > a { padding: 11px 8px; }
 .language-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); }
 .site-header .language-grid > a { gap: 7px; padding: 9px 5px; }
 .nav-signup { text-align: center; margin-top: 8px; }
 .site-header nav > .login { padding: 12px 10px; }
}

#purchase-link[aria-disabled="true"], .purchase-existing[aria-disabled="true"] { opacity: .45; cursor: not-allowed; }
@media(max-width:800px) { body.navigation-open { overflow: hidden; } .site-header nav.open { overscroll-behavior: contain; } }
