:root{--ink:#06101f;--navy:#0a1730;--blue:#4f7cff;--cyan:#39d9e8;--orange:#ff826a;--green:#55d59a;--violet:#9674ff;--soft:#f6f8fc;--line:#dfe6f0;--text:#10203a;--muted:#66758d}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;font-family:Pretendard,"Noto Sans KR",Arial,sans-serif;background:var(--soft);color:var(--text)}a{text-decoration:none;color:inherit}.wrap{width:min(1240px,calc(100% - 40px));margin:auto}.topnav{position:sticky;top:0;z-index:50;background:rgba(4,12,27,.88);backdrop-filter:blur(18px);border-bottom:1px solid rgba(255,255,255,.1)}.topnav .wrap{height:76px;display:flex;align-items:center;justify-content:space-between}.brand{font-size:23px;font-weight:900;color:#fff}.navlinks{display:flex;gap:28px;color:#d5deed;font-size:14px}.navcta{padding:12px 18px;border-radius:12px;background:#1468f2;color:white;font-weight:800}.hero{min-height:700px;background:radial-gradient(circle at 12% 20%,rgba(79,124,255,.24),transparent 27%),radial-gradient(circle at 85% 25%,rgba(57,217,232,.12),transparent 26%),linear-gradient(145deg,#040b18,#08152d 62%,#0b1c3d);color:white;display:flex;align-items:center;overflow:hidden}.hero-grid{display:grid;grid-template-columns:.9fr 1.1fr;gap:48px;align-items:center;padding:70px 0}.eyebrow{font-size:13px;letter-spacing:.18em;font-weight:900;color:#7ee8f2}.hero h1{font-size:clamp(44px,6vw,76px);line-height:1.02;margin:14px 0 22px;letter-spacing:-.05em}.hero p{font-size:20px;line-height:1.8;color:#c4cfdf}.actions{display:flex;gap:14px;margin-top:30px}.btn{display:inline-flex;padding:15px 24px;border-radius:13px;font-weight:900}.btn.primary{background:#1168f3;color:#fff;box-shadow:0 16px 34px rgba(17,104,243,.28)}.btn.ghost{border:1px solid rgba(255,255,255,.22);color:#fff}.hub-visual{position:relative;min-height:560px}.core{position:absolute;left:43%;top:39%;width:190px;height:190px;border-radius:50%;display:grid;place-items:center;text-align:center;background:radial-gradient(circle,#fff 0 43%,#dfeaff 44% 53%,rgba(56,131,255,.65) 54% 62%,transparent 63%);filter:drop-shadow(0 0 36px rgba(65,146,255,.9));font-size:24px;font-weight:950;color:#173568}.system-card{position:absolute;width:255px;padding:23px;border-radius:22px;background:linear-gradient(145deg,rgba(255,255,255,.12),rgba(255,255,255,.035));border:1px solid rgba(255,255,255,.2);box-shadow:0 24px 60px rgba(0,0,0,.32);backdrop-filter:blur(18px)}.system-card h3{font-size:28px;margin:0 0 7px}.system-card p{font-size:14px;margin:0;color:#d8e1ef;line-height:1.55}.system-card ul{margin:16px 0 0;padding-left:18px;color:#d8e1ef;font-size:13px;line-height:1.8}.system-card.realty{left:0;top:40px;border-color:rgba(79,124,255,.6)}.system-card.prop{right:0;top:38px;border-color:rgba(255,130,106,.58)}.system-card.rental{right:18px;bottom:10px;border-color:rgba(85,213,154,.58)}.system-card.realty h3{color:#72a0ff}.system-card.prop h3{color:#ff8f79}.system-card.rental h3{color:#63dba1}.beam{position:absolute;height:4px;border-radius:999px;transform-origin:left center;box-shadow:0 0 18px currentColor}.beam.b1{left:255px;top:195px;width:250px;transform:rotate(14deg);background:#4f7cff;color:#4f7cff}.beam.b2{left:660px;top:198px;width:220px;transform:rotate(-13deg);background:#ff826a;color:#ff826a}.beam.b3{left:650px;top:420px;width:235px;transform:rotate(20deg);background:#55d59a;color:#55d59a}.section{padding:100px 0}.section.white{background:white}.section.dark{background:#09152b;color:white}.section-head{max-width:780px;margin-bottom:44px}.section-head.center{text-align:center;margin-left:auto;margin-right:auto}.section h2{font-size:clamp(34px,4vw,54px);letter-spacing:-.04em;margin:0 0 16px}.section-head p{font-size:18px;color:var(--muted);line-height:1.75}.dark .section-head p{color:#a9b6ca}.cards3{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}.product-card,.group-card{background:white;border:1px solid var(--line);border-radius:28px;padding:28px;box-shadow:0 10px 32px rgba(25,46,82,.07);transition:.25s}.product-card:hover,.group-card:hover{transform:translateY(-6px);box-shadow:0 25px 60px rgba(25,46,82,.15)}.product-card .icon,.group-card .icon{height:160px;border-radius:22px;display:grid;place-items:center;font-size:64px;background:linear-gradient(145deg,#07111f,#12284c);margin-bottom:22px}.product-card h3,.group-card h3{font-size:26px;margin:0 0 12px}.product-card p,.group-card p{color:var(--muted);line-height:1.7;margin:0}.tagrow{display:flex;gap:7px;flex-wrap:wrap;margin-top:18px}.tag{font-size:12px;font-weight:800;background:#eef3fb;padding:7px 10px;border-radius:999px}.groups6{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}.groups2{display:grid;grid-template-columns:repeat(2,1fr);gap:24px}.groups4{display:grid;grid-template-columns:repeat(2,1fr);gap:24px}.group-card .icon{height:180px}.effect{margin-top:18px;padding:16px;border-radius:16px;background:#f2f6fc;color:#35506f;font-weight:700;font-size:14px;line-height:1.6}.cta-strip{margin-top:42px;padding:34px;border-radius:28px;background:linear-gradient(135deg,#0b1a36,#102653);color:#fff;display:flex;align-items:center;justify-content:space-between}.trial{background:#07111f;color:white}.trial-grid{display:grid;grid-template-columns:.9fr 1.1fr;gap:50px}.trial-card{background:white;color:var(--text);padding:32px;border-radius:28px}.field{display:grid;gap:8px;margin-bottom:16px}.field label{font-weight:800}.field input,.field select,.field textarea{width:100%;padding:14px;border:1px solid #ced8e7;border-radius:11px;font:inherit}.backbar{padding:18px 0;background:#07111f;color:#dbe6f5}.detail-list{display:grid;gap:18px}.detail-item{padding:26px;border:1px solid var(--line);border-radius:22px;background:white}.detail-item h3{margin:0 0 10px;font-size:23px}.detail-item p{margin:0;color:var(--muted);line-height:1.8}.footer{padding:34px 0;background:#040b18;color:#8fa0ba}@media(max-width:980px){.hero-grid,.trial-grid{grid-template-columns:1fr}.hub-visual{min-height:650px}.cards3,.groups6{grid-template-columns:1fr}.groups2,.groups4{grid-template-columns:1fr}.navlinks{display:none}}@media(max-width:650px){.hub-visual{min-height:860px}.system-card{position:relative!important;left:auto!important;right:auto!important;top:auto!important;bottom:auto!important;width:100%;margin:15px 0}.core,.beam{display:none}.actions{flex-direction:column}.cta-strip{display:block}.cta-strip .btn{margin-top:18px}.section{padding:74px 0}}

/* =========================================================
   EstateHub Hero V5
   - 전체 시안 이미지를 사용하지 않고 HTML/CSS로 직접 구현
   - 오른쪽 제품 다이어그램과 카드는 실제 링크 요소
   ========================================================= */
.estate-hero{
  position:relative;
  overflow:hidden;
  padding:72px 0 34px;
  color:#fff;
  background:
    linear-gradient(rgba(49,114,213,.075) 1px,transparent 1px),
    linear-gradient(90deg,rgba(49,114,213,.075) 1px,transparent 1px),
    radial-gradient(circle at 10% 30%,rgba(43,91,255,.22),transparent 31%),
    radial-gradient(circle at 91% 42%,rgba(35,202,221,.16),transparent 30%),
    linear-gradient(135deg,#020a19 0%,#07162f 54%,#08213b 100%);
  background-size:48px 48px,48px 48px,auto,auto,auto;
}
.estate-hero__glow{position:absolute;border-radius:50%;filter:blur(55px);pointer-events:none}
.estate-hero__glow--left{width:290px;height:290px;left:-120px;top:80px;background:rgba(45,82,255,.16)}
.estate-hero__glow--right{width:320px;height:320px;right:-110px;top:120px;background:rgba(39,213,203,.13)}
.estate-hero__layout{position:relative;z-index:2;display:grid;grid-template-columns:minmax(0,.86fr) minmax(610px,1.14fr);gap:44px;align-items:center}
.estate-hero__copy{padding:28px 0 20px}
.estate-hero__eyebrow{color:#3de2ee;font-size:12px;font-weight:900;letter-spacing:.2em;margin-bottom:18px}
.estate-hero__copy h1{margin:0;color:#fff;font-size:clamp(46px,5.05vw,73px);line-height:1.04;letter-spacing:-.055em;font-weight:950}
.estate-hero__copy h1 span{display:block;margin-top:8px;color:#70a0ff;text-shadow:0 10px 34px rgba(52,116,255,.26)}
.estate-hero__lead{margin:22px 0 0;color:#d1dbea;font-size:17px;line-height:1.78;letter-spacing:-.015em}
.estate-hero__features{display:flex;flex-wrap:wrap;gap:9px;margin-top:25px}
.estate-hero__features span{display:inline-flex;align-items:center;gap:7px;padding:9px 12px;border:1px solid rgba(145,176,228,.28);border-radius:999px;background:rgba(13,35,68,.7);font-size:12px;font-weight:800;color:#e8f0ff;box-shadow:inset 0 0 18px rgba(87,145,255,.05)}
.estate-hero__features span::before{content:"";width:7px;height:7px;border-radius:50%;background:#54e3c2;box-shadow:0 0 10px #54e3c2}
.estate-hero__actions{display:flex;gap:13px;margin-top:27px}
.hero-button{display:inline-flex;align-items:center;justify-content:center;min-height:50px;padding:0 22px;border-radius:10px;font-size:14px;font-weight:900;transition:.22s ease}
.hero-button:hover{transform:translateY(-2px)}
.hero-button--primary{background:linear-gradient(135deg,#2582ff,#0e5fe8);color:#fff;box-shadow:0 15px 30px rgba(21,104,244,.27)}
.hero-button--primary b{margin-left:9px;font-size:18px}
.hero-button--secondary{color:#e8f2ff;border:1px solid rgba(141,180,239,.38);background:rgba(4,18,39,.5)}
.estate-diagram{position:relative;min-height:560px;padding-top:10px}
.estate-diagram__lines{position:absolute;inset:0;width:100%;height:100%;overflow:visible;pointer-events:none}
.estate-diagram__lines path{fill:none;stroke-width:2;stroke-dasharray:5 6;filter:drop-shadow(0 0 5px currentColor)}
.estate-diagram__hub{position:relative;z-index:3;width:184px;height:184px;margin:0 auto;border-radius:50%;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;background:radial-gradient(circle at 50% 42%,rgba(31,92,180,.7),rgba(4,17,42,.94) 68%);border:2px solid #63cfff;box-shadow:0 0 0 8px rgba(65,141,255,.08),0 0 34px rgba(66,183,255,.75),inset 0 0 34px rgba(40,130,255,.3)}
.estate-diagram__hub::after{content:"";position:absolute;inset:-13px;border:1px solid rgba(76,163,255,.26);border-radius:50%}
.estate-diagram__building{font-size:30px;line-height:1;color:#d9eeff;margin-bottom:8px}
.estate-diagram__hub strong{font-size:27px;letter-spacing:-.03em}
.estate-diagram__hub span{margin-top:7px;color:#b8d2ee;font-size:12px}
.estate-diagram__cards{position:relative;z-index:4;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin-top:63px}
.hub-product{position:relative;min-height:316px;padding:54px 19px 17px;border-radius:18px;color:#fff;background:linear-gradient(180deg,rgba(11,31,64,.9),rgba(4,18,42,.94));border:1px solid rgba(88,158,255,.48);box-shadow:0 18px 40px rgba(0,0,0,.22);transition:.24s ease;overflow:hidden}
.hub-product::before{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 53%,rgba(27,77,157,.12));pointer-events:none}
.hub-product:hover{transform:translateY(-8px);box-shadow:0 28px 50px rgba(0,0,0,.32)}
.hub-product__icon{position:absolute;top:-34px;left:50%;transform:translateX(-50%);width:68px;height:68px;border-radius:50%;display:grid;place-items:center;font-size:30px;font-weight:900;background:linear-gradient(145deg,#2e9cff,#1767eb);border:7px solid #07172f;box-shadow:0 0 24px rgba(36,139,255,.58)}
.hub-product h2{position:relative;margin:0;text-align:center;font-size:25px;letter-spacing:-.035em;color:#43a5ff}
.hub-product p{position:relative;margin:7px 0 14px;text-align:center;color:#e1e9f5;font-size:12px;line-height:1.45}
.hub-product ul{position:relative;list-style:none;padding:14px 0 0;margin:0;border-top:1px solid rgba(137,172,225,.16)}
.hub-product li{position:relative;padding-left:18px;margin:9px 0;color:#dce7f7;font-size:12px;line-height:1.35}
.hub-product li::before{content:"✓";position:absolute;left:0;top:0;color:#2ba6ff;font-weight:900}
.hub-product__link{position:absolute;left:15px;right:15px;bottom:14px;display:flex;align-items:center;justify-content:center;height:37px;border-radius:8px;border:1px solid rgba(47,140,255,.75);background:rgba(14,69,137,.22);font-size:12px;font-weight:800}
.hub-product--prop{border-color:rgba(143,100,255,.58);background:linear-gradient(180deg,rgba(30,27,82,.87),rgba(10,16,50,.95))}
.hub-product--prop .hub-product__icon{background:linear-gradient(145deg,#956bff,#6540e5);box-shadow:0 0 24px rgba(139,93,255,.62)}
.hub-product--prop h2,.hub-product--prop li::before{color:#9b72ff}
.hub-product--prop .hub-product__link{border-color:rgba(148,95,255,.8);background:rgba(83,45,151,.25)}
.hub-product--rental{border-color:rgba(42,208,153,.56);background:linear-gradient(180deg,rgba(8,52,60,.83),rgba(4,31,42,.95))}
.hub-product--rental .hub-product__icon{background:linear-gradient(145deg,#38d78f,#16a967);box-shadow:0 0 24px rgba(44,221,154,.55)}
.hub-product--rental h2,.hub-product--rental li::before{color:#42db9d}
.hub-product--rental .hub-product__link{border-color:rgba(48,212,147,.78);background:rgba(22,112,78,.23)}
.estate-benefits{position:relative;z-index:3;display:grid;grid-template-columns:repeat(4,1fr);margin-top:30px;border:1px solid rgba(78,137,224,.34);border-radius:18px;background:rgba(4,20,46,.62);box-shadow:0 18px 40px rgba(0,0,0,.16);backdrop-filter:blur(10px)}
.estate-benefit{display:flex;align-items:center;gap:14px;min-height:105px;padding:20px 23px;border-right:1px solid rgba(95,143,214,.18)}
.estate-benefit:last-child{border-right:0}
.estate-benefit__icon{flex:0 0 50px;width:50px;height:50px;border-radius:50%;display:grid;place-items:center;color:#78adff;font-size:22px;font-weight:900;background:rgba(28,79,159,.31);border:1px solid rgba(84,142,229,.25);box-shadow:inset 0 0 18px rgba(52,117,224,.2)}
.estate-benefit strong{display:block;color:#a8c7ff;font-size:16px;margin-bottom:5px}
.estate-benefit small{display:block;color:#b7c5d9;font-size:11px;line-height:1.45}
@media(max-width:1120px){
  .estate-hero__layout{grid-template-columns:1fr;gap:54px}
  .estate-hero__copy{max-width:760px;text-align:center;margin:auto}
  .estate-hero__features,.estate-hero__actions{justify-content:center}
  .estate-diagram{max-width:780px;width:100%;margin:auto}
  .estate-benefits{grid-template-columns:repeat(2,1fr)}
  .estate-benefit:nth-child(2){border-right:0}
  .estate-benefit:nth-child(-n+2){border-bottom:1px solid rgba(95,143,214,.18)}
}
@media(max-width:720px){
  .estate-hero{padding-top:52px}
  .estate-hero__copy h1{font-size:44px}
  .estate-hero__lead br{display:none}
  .estate-hero__actions{flex-direction:column}
  .estate-diagram{min-height:auto;padding-top:0}
  .estate-diagram__lines{display:none}
  .estate-diagram__hub{width:156px;height:156px;margin-bottom:52px}
  .estate-diagram__cards{grid-template-columns:1fr;margin-top:0;gap:48px}
  .hub-product{min-height:300px}
  .estate-benefits{grid-template-columns:1fr}
  .estate-benefit{border-right:0!important;border-bottom:1px solid rgba(95,143,214,.18)!important}
  .estate-benefit:last-child{border-bottom:0!important}
}

/* =========================================================
   EstateHub Hero V5
   적용 위치: static/css/estatehub-v2.css 가장 아래
   기존 .hero 스타일과 충돌하지 않도록 eh- 접두사 사용
========================================================= */

/* Hero 전체 배경 */
.eh-hero {
    position: relative;
    overflow: hidden;
    color: #ffffff;
    padding: 16px 0 42px;

    background:
        radial-gradient(
            circle at 76% 20%,
            rgba(20, 112, 255, 0.2),
            transparent 32%
        ),
        radial-gradient(
            circle at 94% 48%,
            rgba(23, 201, 196, 0.1),
            transparent 27%
        ),
        linear-gradient(
            135deg,
            #020916 0%,
            #06142b 55%,
            #08203a 100%
        );
}

/* 희미한 격자 배경 */
.eh-hero::before {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;

    background-image:
        linear-gradient(
            rgba(74, 132, 210, 0.08) 1px,
            transparent 1px
        ),
        linear-gradient(
            90deg,
            rgba(74, 132, 210, 0.08) 1px,
            transparent 1px
        );

    background-size: 48px 48px;
    mask-image: linear-gradient(
        to bottom,
        rgba(0, 0, 0, 0.9),
        rgba(0, 0, 0, 0.35)
    );
}

/* 실제 콘텐츠는 배경 위에 표시 */
.eh-hero > .wrap {
    position: relative;
    z-index: 2;
}

/* 상단 2단 구성 */
.eh-hero-main {
    display: grid;
    grid-template-columns: minmax(370px, 0.82fr) minmax(650px, 1.35fr);
    gap: 52px;
    align-items: center;
}

/* =========================================================
   왼쪽 문구 영역
========================================================= */

.eh-hero-copy {
    padding: 18px 0 32px;
}

/* =========================================================
   Hero 상단 Eyebrow
   - Cyan 라인 추가
   - 약한 Italic으로 세련된 느낌
========================================================= */
.eh-hero-eyebrow {

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

    margin-bottom: 18px;

    color: #43e5ed;

    font-size: 13px;
    font-weight: 800;

    letter-spacing: .22em;
    text-transform: uppercase;

    font-style: italic;

    /* 너무 과하지 않게 살짝만 기울임 */
    transform: skewX(-6deg);
}

.eh-hero-eyebrow::before {

    content: "";

    width: 34px;
    height: 2px;

    border-radius: 2px;

    background: #43e5ed;

    box-shadow: 0 0 10px rgba(67,229,237,.65);
}

.eh-hero-title {
    margin: 0;
    letter-spacing: -0.055em;
}

.eh-hero-title span {
    display: block;
    margin-bottom: 20px;

    color: #75a2ff;
    font-size: clamp(58px, 5vw, 84px);
    line-height: 0.94;
    font-weight: 950;
}

.eh-hero-title strong {
    display: block;

    color: #ffffff;
    font-size: clamp(36px, 3.2vw, 54px);
    line-height: 1.18;
    font-weight: 900;
}

.eh-title-line {
    width: 72px;
    height: 4px;
    margin: 25px 0 22px;

    border-radius: 999px;
    background: linear-gradient(
        90deg,
        #1594ff,
        #58ddff
    );

    box-shadow: 0 0 16px rgba(40, 166, 255, 0.45);
}

.eh-hero-description {
    margin: 0;

    color: #d0daea;
    font-size: 17px;
    line-height: 1.8;
    word-break: keep-all;
}

.eh-hero-checks {
    display: grid;
    gap: 15px;

    margin: 27px 0 0;
    padding: 0;

    list-style: none;
}

.eh-hero-checks li {
    display: flex;
    gap: 12px;
    align-items: center;

    color: #edf4ff;
    font-size: 16px;
    line-height: 1.45;
}

.eh-check-icon {
    display: inline-grid;
    flex: 0 0 28px;
    width: 28px;
    height: 28px;
    place-items: center;

    border: 1px solid rgba(92, 170, 255, 0.55);
    border-radius: 50%;

    background: linear-gradient(
        145deg,
        #1787ff,
        #0752c8
    );

    color: #ffffff;
    font-size: 15px;
    font-weight: 900;

    box-shadow: 0 7px 18px rgba(0, 100, 255, 0.25);
}

.eh-hero-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 15px;

    margin-top: 32px;
}

.eh-btn {
    display: inline-flex;
    min-height: 52px;
    align-items: center;
    justify-content: center;
    gap: 11px;

    padding: 0 25px;
    border-radius: 11px;

    font-size: 15px;
    font-weight: 850;

    transition:
        transform 0.22s ease,
        box-shadow 0.22s ease,
        border-color 0.22s ease;
}

.eh-btn:hover {
    transform: translateY(-3px);
}

.eh-btn-primary {
    background: linear-gradient(
        135deg,
        #1683ff,
        #075ce7
    );

    color: #ffffff;

    box-shadow:
        0 14px 30px rgba(4, 98, 237, 0.28),
        inset 0 1px 0 rgba(255, 255, 255, 0.25);
}

.eh-btn-primary:hover {
    box-shadow:
        0 18px 38px rgba(4, 98, 237, 0.4),
        inset 0 1px 0 rgba(255, 255, 255, 0.25);
}

.eh-btn-outline {
    border: 1px solid rgba(102, 165, 255, 0.64);
    background: rgba(4, 18, 41, 0.38);
    color: #dceaff;
}

.eh-btn-outline:hover {
    border-color: #75b4ff;
}

/* =========================================================
   오른쪽 다이어그램 영역
========================================================= */

.eh-system-diagram {
    position: relative;

    /* 카드가 잘리지 않도록 충분한 높이 확보 */
    min-height: 650px;

    /* 아이콘이 카드 밖으로 나와도 표시 */
    overflow: visible;
}

/* EstateHub 원형 허브 */
.eh-hub-node {
    position: absolute;
    z-index: 5;
    top: 0;
    left: 50%;

    display: flex;
    width: 210px;
    height: 210px;
    flex-direction: column;
    align-items: center;
    justify-content: center;

    border: 2px solid #58c9ff;
    border-radius: 50%;

    background:
        radial-gradient(
            circle at 48% 42%,
            rgba(20, 91, 184, 0.6),
            rgba(1, 20, 49, 0.98) 67%
        );

    transform: translateX(-50%);

    box-shadow:
        0 0 0 8px rgba(46, 147, 255, 0.08),
        0 0 0 15px rgba(46, 147, 255, 0.04),
        0 0 38px rgba(46, 147, 255, 0.72),
        inset 0 0 28px rgba(55, 162, 255, 0.25);
}

.eh-hub-node::after {
    content: "";
    position: absolute;
    inset: 12px;

    border: 1px solid rgba(137, 217, 255, 0.35);
    border-radius: 50%;
}

.eh-hub-building {
    position: relative;
    z-index: 2;

    margin-bottom: 10px;

    color: #bce7ff;
    font-size: 37px;
    line-height: 1;
}

.eh-hub-node strong {
    position: relative;
    z-index: 2;

    color: #ffffff;
    font-size: 27px;
    line-height: 1.1;
}

.eh-hub-node span {
    position: relative;
    z-index: 2;

    margin-top: 9px;

    color: #c4d7ef;
    font-size: 12px;
}

/* SVG 연결선 영역 */
.eh-connector-lines {
    position: absolute;
    z-index: 1;
    top: 168px;
    left: 0;

    width: 100%;
    height: 265px;

    overflow: visible;
    pointer-events: none;
}

.eh-line {
    fill: none;
    stroke-width: 3;
    stroke-linecap: round;
    stroke-dasharray: 8 8;
}

.eh-line-realty {
    stroke: #40bfff;
    filter: url("#eh-blue-glow");
}

.eh-line-prop {
    stroke: #a576ff;
    filter: url("#eh-purple-glow");
}

.eh-line-rental {
    stroke: #4ae1a6;
    filter: url("#eh-green-glow");
}

.eh-line-dot {
    stroke: rgba(255, 255, 255, 0.65);
    stroke-width: 2;
}

.eh-line-dot-realty {
    fill: #40bfff;
    filter: url("#eh-blue-glow");
}

.eh-line-dot-prop {
    fill: #a576ff;
    filter: url("#eh-purple-glow");
}

.eh-line-dot-rental {
    fill: #4ae1a6;
    filter: url("#eh-green-glow");
}

/* 세 제품 카드의 바깥 배치 */
.eh-system-cards {
    position: absolute;
    z-index: 4;
    top: 300px;
    right: 0;
    left: 0;

    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 20px;

    /* 카드 아이콘 돌출 영역 확보 */
    padding-top: 30px;
}

/* 제품 카드 공통 */
.eh-system-card {
    position: relative;

    display: flex;
    min-height: 338px;
    flex-direction: column;

    /* 상단 돌출 아이콘 공간 */
    padding: 54px 18px 16px;

    border: 1px solid rgba(101, 170, 255, 0.42);
    border-radius: 19px;

    background:
        linear-gradient(
            180deg,
            rgba(9, 37, 75, 0.92),
            rgba(3, 21, 48, 0.94)
        );

    /* 반드시 visible이어야 아이콘이 잘리지 않음 */
    overflow: visible;

    box-shadow:
        0 24px 50px rgba(0, 0, 0, 0.26),
        inset 0 1px 0 rgba(255, 255, 255, 0.06);

    transition:
        transform 0.25s ease,
        border-color 0.25s ease,
        box-shadow 0.25s ease;
}

.eh-system-card:hover {
    z-index: 7;
    transform: translateY(-7px);
}

/* 카드 위 원형 아이콘 */
.eh-card-icon {
    position: absolute;
    z-index: 8;
    top: -34px;
    left: 50%;

    display: grid;
    width: 68px;
    height: 68px;
    place-items: center;

    border: 5px solid #082044;
    border-radius: 50%;

    transform: translateX(-50%);

    color: #ffffff;
    font-size: 28px;
    font-weight: 900;

    box-shadow:
        0 0 0 1px rgba(255, 255, 255, 0.14),
        0 10px 25px rgba(0, 0, 0, 0.34);
}

.eh-realty-card {
    border-color: rgba(31, 154, 255, 0.66);
}

.eh-realty-card:hover {
    border-color: #40bfff;
    box-shadow:
        0 25px 55px rgba(0, 81, 175, 0.3),
        0 0 25px rgba(64, 191, 255, 0.13);
}

.eh-realty-card .eh-card-icon {
    background: linear-gradient(
        145deg,
        #43b9ff,
        #0756e6
    );
}

.eh-prop-card {
    border-color: rgba(151, 97, 255, 0.7);

    background:
        linear-gradient(
            180deg,
            rgba(37, 26, 93, 0.92),
            rgba(16, 20, 61, 0.95)
        );
}

.eh-prop-card:hover {
    border-color: #ac7cff;
    box-shadow:
        0 25px 55px rgba(85, 42, 170, 0.3),
        0 0 25px rgba(166, 118, 255, 0.15);
}

.eh-prop-card .eh-card-icon {
    background: linear-gradient(
        145deg,
        #bc88ff,
        #6731dc
    );
}

.eh-rental-card {
    border-color: rgba(43, 210, 145, 0.7);

    background:
        linear-gradient(
            180deg,
            rgba(5, 59, 65, 0.92),
            rgba(3, 34, 46, 0.95)
        );
}

.eh-rental-card:hover {
    border-color: #49e1a4;
    box-shadow:
        0 25px 55px rgba(5, 132, 94, 0.28),
        0 0 25px rgba(67, 224, 163, 0.14);
}

.eh-rental-card .eh-card-icon {
    background: linear-gradient(
        145deg,
        #4be29c,
        #078854
    );
}

/* 카드 제목 */
.eh-card-header {
    padding-bottom: 15px;
    border-bottom: 1px solid rgba(154, 193, 236, 0.22);
    text-align: center;
}

.eh-card-header h2 {
    margin: 0;

    font-size: 25px;
    line-height: 1.2;
    letter-spacing: -0.025em;
}

.eh-realty-card .eh-card-header h2 {
    color: #37a9ff;
}

.eh-prop-card .eh-card-header h2 {
    color: #a875ff;
}

.eh-rental-card .eh-card-header h2 {
    color: #39dd99;
}

.eh-card-header p {
    margin: 7px 0 0;

    color: #e1e9f5;
    font-size: 13px;
    line-height: 1.45;
}

/* 카드 업무 목록 */
.eh-system-card ul {
    display: grid;
    gap: 8px;

    margin: 15px 0 16px;
    padding: 0;

    list-style: none;
}

.eh-system-card li {
    position: relative;
    padding-left: 19px;

    color: #e0e9f7;
    font-size: 13px;
    line-height: 1.35;
}

.eh-system-card li::before {
    content: "✓";
    position: absolute;
    top: 0;
    left: 0;

    font-weight: 900;
}

.eh-realty-card li::before {
    color: #36adff;
}

.eh-prop-card li::before {
    color: #ae7dff;
}

.eh-rental-card li::before {
    color: #40dda0;
}

/* 카드 아래 링크 버튼 */
.eh-card-link {
    display: flex;
    width: 100%;
    min-height: 40px;
    align-items: center;
    justify-content: center;
    gap: 9px;

    margin-top: auto;

    border: 1px solid rgba(103, 173, 255, 0.5);
    border-radius: 9px;

    background: rgba(1, 14, 35, 0.38);

    color: #ffffff;
    font-size: 13px;
    font-weight: 800;
}

.eh-prop-card .eh-card-link {
    border-color: rgba(165, 112, 255, 0.65);
}

.eh-rental-card .eh-card-link {
    border-color: rgba(54, 218, 154, 0.65);
}

/* =========================================================
   하단 도입 효과
========================================================= */

.eh-benefit-bar {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));

    margin-top: 42px;
    padding: 23px 24px;

    border: 1px solid rgba(76, 153, 244, 0.3);
    border-radius: 20px;

    background:
        linear-gradient(
            90deg,
            rgba(7, 31, 67, 0.88),
            rgba(7, 36, 77, 0.78)
        );

    box-shadow:
        0 18px 42px rgba(0, 0, 0, 0.2),
        inset 0 1px 0 rgba(255, 255, 255, 0.04);
}

.eh-benefit-item {
    display: flex;
    min-width: 0;
    gap: 14px;
    align-items: center;

    padding: 4px 23px;

    border-right: 1px solid rgba(110, 166, 232, 0.22);
}

.eh-benefit-item:first-child {
    padding-left: 4px;
}

.eh-benefit-item:last-child {
    padding-right: 4px;
    border-right: 0;
}

.eh-benefit-icon {
    display: grid;
    flex: 0 0 54px;
    width: 54px;
    height: 54px;
    place-items: center;

    border: 1px solid rgba(90, 168, 255, 0.45);
    border-radius: 50%;

    background:
        radial-gradient(
            circle,
            rgba(41, 121, 255, 0.55),
            rgba(4, 34, 83, 0.85)
        );

    color: #d9edff;
    font-size: 20px;
    font-weight: 900;

    box-shadow:
        0 0 20px rgba(32, 119, 255, 0.25);
}

.eh-benefit-item div:last-child {
    min-width: 0;
}

.eh-benefit-item strong {
    display: block;

    color: #ffffff;
    font-size: 16px;
    line-height: 1.35;
}

.eh-benefit-item span {
    display: block;
    margin-top: 5px;

    color: #aec1d9;
    font-size: 12px;
    line-height: 1.45;
}

/* =========================================================
   태블릿 반응형
========================================================= */

@media (max-width: 1180px) {
    .eh-hero-main {
        grid-template-columns: 1fr;
        gap: 50px;
    }

    .eh-hero-copy {
        max-width: 760px;
    }

    .eh-system-diagram {
        width: min(900px, 100%);
        min-height: 660px;
        margin: 0 auto;
    }

    .eh-benefit-bar {
        grid-template-columns: repeat(2, 1fr);
        gap: 0;
    }

    .eh-benefit-item {
        border-bottom: 1px solid rgba(110, 166, 232, 0.2);
    }

    .eh-benefit-item:nth-child(2) {
        border-right: 0;
    }

    .eh-benefit-item:nth-child(3),
    .eh-benefit-item:nth-child(4) {
        padding-top: 18px;
        border-bottom: 0;
    }
}

/* =========================================================
   모바일 반응형
========================================================= */

@media (max-width: 760px) {
    .eh-hero {
        padding: 54px 0 30px;
    }

    .eh-hero-title span {
        font-size: 53px;
    }

    .eh-hero-title strong {
        font-size: 35px;
    }

    .eh-hero-description br {
        display: none;
    }

    .eh-hero-actions {
        flex-direction: column;
    }

    .eh-btn {
        width: 100%;
    }

    /*
       모바일에서는 복잡한 연결선을 숨기고
       허브와 카드가 자연스럽게 세로로 표시됩니다.
    */
    .eh-system-diagram {
        display: flex;
        min-height: 0;
        flex-direction: column;
        gap: 28px;
    }

    .eh-hub-node {
        position: relative;
        top: auto;
        left: auto;

        width: 180px;
        height: 180px;
        margin: 0 auto;

        transform: none;
    }

    .eh-connector-lines {
        display: none;
    }

    .eh-system-cards {
        position: relative;
        top: auto;
        right: auto;
        left: auto;

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

        padding-top: 28px;
    }

    .eh-system-card {
        min-height: auto;
        padding-right: 22px;
        padding-left: 22px;
    }

    .eh-benefit-bar {
        grid-template-columns: 1fr;
        gap: 0;
        padding: 15px 20px;
    }

    .eh-benefit-item,
    .eh-benefit-item:first-child,
    .eh-benefit-item:last-child {
        padding: 16px 0;

        border-right: 0;
        border-bottom: 1px solid rgba(110, 166, 232, 0.2);
    }

    .eh-benefit-item:last-child {
        border-bottom: 0;
    }
}

/* =========================================================
   Hero 하단 효과 카드와 제품 카드 사이 여백 보완
   삽입 위치: estatehub-v2.css 가장 아래
========================================================= */

/* 제품 카드 아래와 효과 카드 사이 간격 확대 */
.eh-benefit-bar {
    margin-top: 78px;
}

/* 태블릿에서는 간격을 조금 줄임 */
@media (max-width: 1180px) {
    .eh-benefit-bar {
        margin-top: 58px;
    }
}

/* 모바일에서는 세로 흐름에 맞게 적당한 간격 적용 */
@media (max-width: 760px) {
    .eh-benefit-bar {
        margin-top: 42px;
    }
}\n\n/* =========================================================\n   EstateHub 소개 섹션 (2페이지)\n   Hero는 유지하고 기존 #systems 앞에 추가되는 독립 섹션\n========================================================= */\n.eh-intro-section {\n    position: relative;\n    overflow: hidden;\n    padding: 118px 0 110px;\n    background:\n        radial-gradient(circle at 8% 12%, rgba(62, 116, 255, 0.08), transparent 27%),\n        radial-gradient(circle at 92% 82%, rgba(45, 211, 171, 0.08), transparent 25%),\n        linear-gradient(180deg, #ffffff 0%, #f7f9fd 100%);\n}\n\n.eh-intro-section::before {\n    content: "";\n    position: absolute;\n    inset: 0;\n    pointer-events: none;\n    background-image:\n        linear-gradient(rgba(50, 84, 135, 0.035) 1px, transparent 1px),\n        linear-gradient(90deg, rgba(50, 84, 135, 0.035) 1px, transparent 1px);\n    background-size: 52px 52px;\n    mask-image: linear-gradient(to bottom, rgba(0,0,0,.65), transparent 85%);\n}\n\n.eh-intro-section > .wrap {\n    position: relative;\n    z-index: 2;\n}\n\n.eh-intro-heading {\n    max-width: 860px;\n    margin: 0 auto 58px;\n    text-align: center;\n}\n\n.eh-intro-eyebrow {\n    display: inline-flex;\n    align-items: center;\n    gap: 12px;\n    margin-bottom: 18px;\n    color: #2677e8;\n    font-size: 12px;\n    font-weight: 900;\n    font-style: italic;\n    letter-spacing: .2em;\n}\n\n.eh-intro-eyebrow::before,\n.eh-intro-eyebrow::after {\n    content: "";\n    width: 28px;\n    height: 2px;\n    border-radius: 999px;\n    background: linear-gradient(90deg, transparent, #4a9cff);\n}\n\n.eh-intro-eyebrow::after {\n    background: linear-gradient(90deg, #4a9cff, transparent);\n}\n\n.eh-intro-heading h2 {\n    margin: 0;\n    color: #10213b;\n    font-size: clamp(36px, 4vw, 58px);\n    line-height: 1.2;\n    letter-spacing: -.05em;\n    font-weight: 950;\n}\n\n.eh-intro-heading h2 span {\n    color: #347ce8;\n}\n\n.eh-intro-heading p {\n    max-width: 760px;\n    margin: 23px auto 0;\n    color: #66758c;\n    font-size: 17px;\n    line-height: 1.85;\n    word-break: keep-all;\n}\n\n.eh-intro-flow {\n    display: grid;\n    grid-template-columns: minmax(0, 1fr) 64px minmax(0, 1fr) 64px minmax(0, 1fr);\n    gap: 0;\n    align-items: stretch;\n}\n\n.eh-flow-card {\n    position: relative;\n    display: flex;\n    min-width: 0;\n    min-height: 405px;\n    flex-direction: column;\n    padding: 30px 28px 25px;\n    border: 1px solid #dbe5f3;\n    border-radius: 26px;\n    background: rgba(255,255,255,.94);\n    box-shadow: 0 18px 50px rgba(35, 59, 96, .09);\n    transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease;\n}\n\n.eh-flow-card:hover {\n    transform: translateY(-7px);\n    box-shadow: 0 28px 65px rgba(35, 59, 96, .15);\n}\n\n.eh-flow-number {\n    position: absolute;\n    top: 22px;\n    right: 24px;\n    color: #d8e3f1;\n    font-size: 38px;\n    line-height: 1;\n    font-weight: 950;\n}\n\n.eh-flow-icon {\n    display: grid;\n    width: 66px;\n    height: 66px;\n    place-items: center;\n    margin-bottom: 25px;\n    border-radius: 19px;\n    color: #fff;\n    font-size: 29px;\n    font-weight: 900;\n    box-shadow: 0 14px 28px rgba(28, 103, 226, .2);\n}\n\n.eh-flow-card--realty .eh-flow-icon { background: linear-gradient(145deg, #4cb7ff, #1762ea); }\n.eh-flow-card--prop .eh-flow-icon { background: linear-gradient(145deg, #b183ff, #6843e4); }\n.eh-flow-card--rental .eh-flow-icon { background: linear-gradient(145deg, #54dda4, #139669); }\n\n.eh-flow-copy > span {\n    display: block;\n    margin-bottom: 8px;\n    font-size: 14px;\n    font-weight: 900;\n}\n\n.eh-flow-card--realty .eh-flow-copy > span { color: #2479e8; }\n.eh-flow-card--prop .eh-flow-copy > span { color: #7c55e8; }\n.eh-flow-card--rental .eh-flow-copy > span { color: #168d65; }\n\n.eh-flow-copy h3 {\n    margin: 0;\n    color: #142641;\n    font-size: 24px;\n    line-height: 1.35;\n    letter-spacing: -.035em;\n}\n\n.eh-flow-copy p {\n    margin: 17px 0 0;\n    color: #6a788d;\n    font-size: 15px;\n    line-height: 1.75;\n    word-break: keep-all;\n}\n\n.eh-flow-result {\n    margin-top: auto;\n    padding: 18px 18px 16px;\n    border-radius: 16px;\n    background: #f3f7fc;\n    border: 1px solid #e4ebf5;\n}\n\n.eh-flow-result strong {\n    display: block;\n    color: #2a466d;\n    font-size: 14px;\n}\n\n.eh-flow-result small {\n    display: block;\n    margin-top: 5px;\n    color: #7b8ca3;\n    font-size: 12px;\n    line-height: 1.45;\n}\n\n.eh-flow-arrow {\n    display: flex;\n    flex-direction: column;\n    align-items: center;\n    justify-content: center;\n    gap: 8px;\n    color: #8da2bd;\n}\n\n.eh-flow-arrow span {\n    position: relative;\n    width: 36px;\n    height: 1px;\n    background: linear-gradient(90deg, #b6c5d8, #5e91da);\n}\n\n.eh-flow-arrow span:first-child::after {\n    content: "";\n    position: absolute;\n    top: -4px;\n    right: -1px;\n    width: 8px;\n    height: 8px;\n    border-top: 1px solid #5e91da;\n    border-right: 1px solid #5e91da;\n    transform: rotate(45deg);\n}\n\n.eh-flow-arrow b {\n    font-size: 11px;\n    letter-spacing: .12em;\n}\n\n.eh-intro-synergy {\n    display: grid;\n    grid-template-columns: .85fr 1.45fr;\n    gap: 38px;\n    align-items: center;\n    margin-top: 38px;\n    padding: 34px 36px;\n    border: 1px solid rgba(87, 140, 222, .26);\n    border-radius: 26px;\n    color: #fff;\n    background:\n        radial-gradient(circle at 12% 25%, rgba(46, 116, 255, .25), transparent 33%),\n        linear-gradient(135deg, #07152b, #102a54);\n    box-shadow: 0 22px 55px rgba(16, 42, 81, .18);\n}\n\n.eh-synergy-message > span {\n    color: #63dbe6;\n    font-size: 11px;\n    font-weight: 900;\n    letter-spacing: .18em;\n}\n\n.eh-synergy-message h3 {\n    margin: 11px 0 10px;\n    font-size: 27px;\n    line-height: 1.35;\n    letter-spacing: -.035em;\n}\n\n.eh-synergy-message p {\n    margin: 0;\n    color: #b9c8dc;\n    font-size: 14px;\n    line-height: 1.7;\n}\n\n.eh-synergy-items {\n    display: grid;\n    grid-template-columns: repeat(2, minmax(0, 1fr));\n    gap: 12px;\n}\n\n.eh-synergy-items > div {\n    position: relative;\n    min-height: 98px;\n    padding: 18px 17px 16px 50px;\n    border: 1px solid rgba(145, 180, 231, .18);\n    border-radius: 16px;\n    background: rgba(255,255,255,.055);\n}\n\n.eh-synergy-items b {\n    position: absolute;\n    top: 18px;\n    left: 16px;\n    color: #65a6ff;\n    font-size: 12px;\n}\n\n.eh-synergy-items strong {\n    display: block;\n    font-size: 14px;\n}\n\n.eh-synergy-items small {\n    display: block;\n    margin-top: 6px;\n    color: #aebdd1;\n    font-size: 11px;\n    line-height: 1.5;\n}\n\n@media (max-width: 1080px) {\n    .eh-intro-flow {\n        grid-template-columns: 1fr;\n        gap: 20px;\n    }\n    .eh-flow-card { min-height: 330px; }\n    .eh-flow-arrow {\n        min-height: 44px;\n        flex-direction: row;\n    }\n    .eh-flow-arrow span { width: 52px; }\n    .eh-intro-synergy { grid-template-columns: 1fr; }\n}\n\n@media (max-width: 720px) {\n    .eh-intro-section { padding: 82px 0 76px; }\n    .eh-intro-heading { margin-bottom: 40px; }\n    .eh-intro-heading h2 br { display: none; }\n    .eh-intro-heading p { font-size: 15px; }\n    .eh-flow-card {\n        min-height: auto;\n        padding: 26px 22px 22px;\n    }\n    .eh-flow-result { margin-top: 24px; }\n    .eh-intro-synergy { padding: 27px 22px; }\n    .eh-synergy-items { grid-template-columns: 1fr; }\n}\n

/* ================================
   RealtyHub
================================ */

/* =========================================================
   RealtyHub 제품 소개 섹션
========================================================= */

.rh-section {
    position: relative;
    overflow: hidden;
    padding: 120px 0;

    background:
        radial-gradient(
            circle at 8% 18%,
            rgba(21, 119, 255, 0.13),
            transparent 30%
        ),
        radial-gradient(
            circle at 92% 82%,
            rgba(35, 189, 255, 0.08),
            transparent 28%
        ),
        linear-gradient(
            180deg,
            #061326 0%,
            #07172c 100%
        );

    color: #ffffff;
}

/* 희미한 배경 격자 */
.rh-section::before {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;

    background-image:
        linear-gradient(
            rgba(73, 132, 204, 0.045) 1px,
            transparent 1px
        ),
        linear-gradient(
            90deg,
            rgba(73, 132, 204, 0.045) 1px,
            transparent 1px
        );

    background-size: 52px 52px;
}

.rh-section > .wrap {
    position: relative;
    z-index: 2;
}

/* =========================================================
   상단 타이틀 구성
========================================================= */

.rh-heading-layout {
    display: grid;
    grid-template-columns: minmax(360px, 0.8fr) minmax(520px, 1.2fr);
    gap: 72px;
    align-items: center;

    margin-bottom: 72px;
}

/* 왼쪽 대형 간판 */
/* RealtyHub 대형 브랜드 영역
   Hero의 EstateHub처럼 별도 박스 없이 표시 */
.rh-brand-sign {
    position: relative;

    padding: 18px 0 24px;

    border: 0;
    border-radius: 0;

    background: transparent;

    box-shadow: none;
}

/* 기존 왼쪽 세로 라인 제거 */
.rh-brand-sign::before {
    display: none;
}

.rh-brand-label {
    display: block;
    margin-bottom: 20px;

    color: #58dfea;

    font-size: 12px;
    font-weight: 900;

    letter-spacing: 0.22em;
    font-style: italic;
}

.rh-brand-sign h2 {
    margin: 0;

    color: #ffffff;

    font-size: clamp(68px, 7vw, 108px);
    line-height: 0.9;
    font-weight: 950;

    letter-spacing: -0.075em;

    text-shadow:
        0 0 30px rgba(51, 141, 255, 0.22);
}

.rh-brand-sign h2 span {
    color: #4a9aff;
}

.rh-brand-sign strong {
    display: block;
    margin-top: 30px;

    color: #ffffff;

    font-size: clamp(26px, 2.6vw, 38px);
    line-height: 1.35;
    font-weight: 850;

    letter-spacing: -0.045em;
}

.rh-brand-sign strong::before {
    content: "";

    display: block;
    width: 70px;
    height: 4px;

    margin-bottom: 24px;

    border-radius: 999px;

    background: linear-gradient(
        90deg,
        #1a8dff,
        #59ddff
    );

    box-shadow:
        0 0 16px rgba(42, 164, 255, 0.5);
}

/* 오른쪽 설명 */
.rh-heading-copy {
    max-width: 690px;
}

.rh-heading-eyebrow {
    display: inline-flex;
    align-items: center;
    gap: 11px;

    margin-bottom: 17px;

    color: #45dce8;

    font-size: 13px;
    font-weight: 850;

    letter-spacing: 0.1em;
}

.rh-heading-eyebrow::before {
    content: "";

    width: 32px;
    height: 2px;

    border-radius: 999px;

    background: #45dce8;
    box-shadow: 0 0 12px rgba(69, 220, 232, 0.55);
}

.rh-heading-copy h3 {
    margin: 0;

    color: #ffffff;

    font-size: clamp(34px, 3.3vw, 50px);
    line-height: 1.28;
    font-weight: 900;

    letter-spacing: -0.05em;
    word-break: keep-all;
}

.rh-heading-copy p {
    margin: 25px 0 0;

    color: #b8c9dc;

    font-size: 18px;
    line-height: 1.85;

    word-break: keep-all;
}

.rh-heading-badges {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;

    margin-top: 28px;
}

.rh-heading-badges span {
    display: inline-flex;
    min-height: 36px;
    align-items: center;

    padding: 0 15px;

    border: 1px solid rgba(75, 157, 255, 0.38);
    border-radius: 999px;

    background: rgba(8, 41, 82, 0.7);

    color: #d4e8ff;

    font-size: 12px;
    font-weight: 750;
}

/* =========================================================
   6개 업무 카드
========================================================= */

.rh-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 25px;
}

.rh-card {
    position: relative;

    display: flex;
    min-height: 410px;
    flex-direction: column;

    padding: 31px 30px 28px;

    border: 1px solid rgba(80, 151, 239, 0.27);
    border-radius: 23px;

    background:
        linear-gradient(
            180deg,
            rgba(12, 39, 75, 0.94),
            rgba(6, 27, 57, 0.97)
        );

    box-shadow:
        0 24px 55px rgba(0, 0, 0, 0.22),
        inset 0 1px 0 rgba(255, 255, 255, 0.045);

    transition:
        transform 0.25s ease,
        border-color 0.25s ease,
        box-shadow 0.25s ease;
}

.rh-card::before {
    content: "";
    position: absolute;
    top: 0;
    right: 28px;
    left: 28px;

    height: 2px;

    background: linear-gradient(
        90deg,
        transparent,
        rgba(52, 170, 255, 0.9),
        transparent
    );

    opacity: 0;
    transition: opacity 0.25s ease;
}

.rh-card:hover {
    transform: translateY(-7px);

    border-color: rgba(56, 171, 255, 0.65);

    box-shadow:
        0 30px 70px rgba(0, 0, 0, 0.3),
        0 0 28px rgba(39, 143, 255, 0.12);
}

.rh-card:hover::before {
    opacity: 1;
}

.rh-card-top {
    display: flex;
    gap: 17px;
    align-items: center;

    padding-bottom: 21px;

    border-bottom: 1px solid rgba(136, 178, 224, 0.17);
}

.rh-icon {
    display: grid;
    flex: 0 0 65px;
    width: 65px;
    height: 65px;
    place-items: center;

    border: 1px solid rgba(94, 185, 255, 0.45);
    border-radius: 18px;

    background: linear-gradient(
        145deg,
        #258dff,
        #124ac7
    );

    color: #ffffff;

    font-size: 28px;
    font-weight: 900;

    box-shadow:
        0 11px 24px rgba(0, 87, 212, 0.25),
        inset 0 1px 0 rgba(255, 255, 255, 0.22);
}

.rh-card-number {
    display: block;
    margin-bottom: 4px;

    color: #45dbea;

    font-size: 11px;
    font-weight: 850;

    letter-spacing: 0.15em;
}

.rh-card h3 {
    margin: 0;

    color: #ffffff;

    font-size: 25px;
    line-height: 1.25;
    font-weight: 850;

    letter-spacing: -0.035em;
}

.rh-card-summary {
    margin: 21px 0 17px;

    color: #c3d2e3;

    font-size: 15px;
    line-height: 1.7;

    word-break: keep-all;
}

.rh-feature-list {
    display: grid;
    gap: 10px;

    margin: 0;
    padding: 0;

    list-style: none;
}

.rh-feature-list li {
    position: relative;

    padding-left: 20px;

    color: #e2ebf6;

    font-size: 14px;
    line-height: 1.45;
}

.rh-feature-list li::before {
    content: "✓";
    position: absolute;
    top: 0;
    left: 0;

    color: #39ccef;

    font-weight: 900;
}

/* 카드 하단 핵심 효과 문구 */
.rh-card-effect{

    margin-top:18px;

    padding-top:16px;

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

/* 기대효과 타이틀 없이 실제 효과만 강조 */
.rh-card-effect span {
    display: block;

    color: #45dce8;

    font-size: 16px;
    line-height: 1.45;
    font-weight: 850;

    letter-spacing: -0.02em;
    word-break: keep-all;
}

/* =========================================================
   하단 CTA
========================================================= */

.rh-bottom-cta {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 30px;

    margin-top: 55px;
    padding: 33px 37px;

    border: 1px solid rgba(66, 158, 255, 0.34);
    border-radius: 23px;

    background:
        linear-gradient(
            100deg,
            rgba(12, 52, 105, 0.88),
            rgba(5, 32, 71, 0.94)
        );

    box-shadow:
        0 24px 55px rgba(0, 0, 0, 0.2),
        inset 0 1px 0 rgba(255, 255, 255, 0.055);
}

.rh-bottom-cta span {
    display: block;
    margin-bottom: 8px;

    color: #49dce8;

    font-size: 11px;
    font-weight: 900;

    letter-spacing: 0.19em;
}

.rh-bottom-cta strong {
    display: block;

    color: #ffffff;

    font-size: 25px;
    line-height: 1.45;
    font-weight: 820;

    letter-spacing: -0.03em;
}

.rh-bottom-cta a {
    display: inline-flex;
    flex: 0 0 auto;
    min-height: 52px;
    align-items: center;
    justify-content: center;
    gap: 10px;

    padding: 0 23px;

    border-radius: 11px;

    background: linear-gradient(
        135deg,
        #1688ff,
        #0d56db
    );

    color: #ffffff;

    font-size: 14px;
    font-weight: 850;

    box-shadow: 0 14px 30px rgba(7, 92, 224, 0.28);

    transition:
        transform 0.22s ease,
        box-shadow 0.22s ease;
}

.rh-bottom-cta a:hover {
    transform: translateY(-3px);

    box-shadow: 0 18px 38px rgba(7, 92, 224, 0.4);
}

/* =========================================================
   반응형
========================================================= */

@media (max-width: 1100px) {
    .rh-heading-layout {
        grid-template-columns: 1fr;
        gap: 38px;
    }

@media (max-width: 720px) {
    .rh-brand-sign {
        padding: 8px 0 18px;
    }

    .rh-brand-sign h2 {
        font-size: 60px;
    }

    .rh-brand-sign strong {
        font-size: 25px;
    }

    .rh-card-effect span {
        font-size: 15px;
    }
}

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

@media (max-width: 720px) {
    .rh-section {
        padding: 82px 0;
    }

    .rh-brand-sign {
        padding: 37px 30px;
    }

    .rh-brand-sign h2 {
        font-size: 58px;
    }

    .rh-brand-sign strong {
        font-size: 18px;
    }

    .rh-heading-copy h3 {
        font-size: 33px;
    }

    .rh-heading-copy h3 br {
        display: none;
    }

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

    .rh-card {
        min-height: auto;
    }

    .rh-bottom-cta {
        align-items: flex-start;
        flex-direction: column;
    }

    .rh-bottom-cta a {
        width: 100%;
    }
}

/* =========================================================
   PropHub 제품 소개 섹션
   삽입 위치: estatehub-v2.css 가장 아래
========================================================= */

.ph-section {
    position: relative;
    overflow: hidden;
    padding: 120px 0;

    color: #ffffff;

    background:
        radial-gradient(
            circle at 12% 17%,
            rgba(115, 65, 255, 0.19),
            transparent 31%
        ),
        radial-gradient(
            circle at 88% 20%,
            rgba(230, 68, 255, 0.12),
            transparent 27%
        ),
        radial-gradient(
            circle at 72% 88%,
            rgba(31, 170, 255, 0.1),
            transparent 30%
        ),
        linear-gradient(
            180deg,
            #080b20 0%,
            #0c1029 48%,
            #080e22 100%
        );
}

/* 배경 격자 */
.ph-section::before {
    content: "";
    position: absolute;
    inset: 0;

    pointer-events: none;

    background-image:
        linear-gradient(
            rgba(125, 102, 199, 0.055) 1px,
            transparent 1px
        ),
        linear-gradient(
            90deg,
            rgba(125, 102, 199, 0.055) 1px,
            transparent 1px
        );

    background-size: 52px 52px;
}

/* 은은한 빛 효과 */
.ph-section::after {
    content: "";
    position: absolute;
    top: 40px;
    right: -180px;

    width: 540px;
    height: 540px;

    border-radius: 50%;

    background:
        radial-gradient(
            circle,
            rgba(140, 78, 255, 0.2),
            transparent 67%
        );

    filter: blur(16px);
    pointer-events: none;
}

.ph-section > .wrap {
    position: relative;
    z-index: 2;
}

/* =========================================================
   상단 소개 영역
========================================================= */

.ph-heading-layout {
    display: grid;
    grid-template-columns:
        minmax(380px, 0.88fr)
        minmax(580px, 1.12fr);

    gap: 72px;
    align-items: center;

    margin-bottom: 76px;
}

/* 왼쪽 브랜드 영역 */
.ph-brand-area {
    padding: 16px 0 26px;
}

.ph-brand-label {
    display: inline-flex;
    align-items: center;
    gap: 12px;

    margin-bottom: 22px;

    color: #bb79ff;

    font-size: 12px;
    font-weight: 900;
    font-style: italic;

    letter-spacing: 0.22em;
}

.ph-brand-label::before {
    content: "";

    width: 34px;
    height: 2px;

    border-radius: 999px;

    background: linear-gradient(
        90deg,
        #8b5cff,
        #ef65ff
    );

    box-shadow:
        0 0 12px rgba(185, 90, 255, 0.6);
}

.ph-brand-area h2 {
    margin: 0;

    color: #ffffff;

    font-size: clamp(72px, 7.1vw, 110px);
    line-height: 0.9;
    font-weight: 950;

    letter-spacing: -0.075em;

    text-shadow:
        0 0 36px rgba(126, 75, 255, 0.25);
}

.ph-brand-area h2 span {
    color: #9a6bff;
}

.ph-brand-area strong {
    display: block;

    margin-top: 32px;

    color: #ffffff;

    font-size: clamp(29px, 2.7vw, 41px);
    line-height: 1.35;
    font-weight: 900;

    letter-spacing: -0.048em;
    word-break: keep-all;
}

.ph-brand-area strong::before {
    content: "";

    display: block;

    width: 72px;
    height: 4px;

    margin-bottom: 25px;

    border-radius: 999px;

    background: linear-gradient(
        90deg,
        #8758ff,
        #ea5cff
    );

    box-shadow:
        0 0 17px rgba(177, 84, 255, 0.55);
}

.ph-brand-area p {
    max-width: 570px;

    margin: 24px 0 0;

    color: #c3c5db;

    font-size: 17px;
    line-height: 1.8;

    word-break: keep-all;
}

/* =========================================================
   오른쪽 광고 네트워크
========================================================= */

.ph-network {
    position: relative;

    min-height: 470px;

    border: 1px solid rgba(159, 103, 255, 0.24);
    border-radius: 32px;

    background:
        radial-gradient(
            circle at center,
            rgba(89, 48, 171, 0.3),
            rgba(8, 12, 35, 0.87) 59%
        );

    box-shadow:
        0 30px 75px rgba(0, 0, 0, 0.3),
        inset 0 1px 0 rgba(255, 255, 255, 0.05);

    overflow: hidden;
}

.ph-network::before {
    content: "";
    position: absolute;
    inset: 0;

    background-image:
        radial-gradient(
            circle,
            rgba(190, 136, 255, 0.28) 1px,
            transparent 1px
        );

    background-size: 28px 28px;

    mask-image:
        radial-gradient(
            circle at center,
            #000,
            transparent 72%
        );
}

.ph-network-center {
    position: absolute;
    z-index: 4;
    top: 50%;
    left: 50%;

    display: flex;
    width: 176px;
    height: 176px;
    flex-direction: column;
    align-items: center;
    justify-content: center;

    border: 2px solid #a46dff;
    border-radius: 50%;

    background:
        radial-gradient(
            circle at 42% 34%,
            rgba(147, 89, 255, 0.72),
            rgba(31, 18, 72, 0.98) 66%
        );

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

    box-shadow:
        0 0 0 8px rgba(151, 88, 255, 0.08),
        0 0 45px rgba(155, 82, 255, 0.67),
        inset 0 0 25px rgba(240, 118, 255, 0.19);
}

.ph-network-center-icon {
    display: grid;

    width: 49px;
    height: 49px;

    margin-bottom: 9px;

    place-items: center;

    border-radius: 15px;

    background:
        linear-gradient(
            145deg,
            #c66fff,
            #6c3be6
        );

    color: #ffffff;

    font-size: 20px;

    box-shadow:
        0 9px 22px rgba(112, 52, 220, 0.4);
}

.ph-network-center strong {
    font-size: 25px;
    font-weight: 900;
}

.ph-network-center small {
    margin-top: 6px;

    color: #d6c9ed;

    font-size: 11px;
}

.ph-network-lines {
    position: absolute;
    z-index: 1;
    inset: 0;

    width: 100%;
    height: 100%;

    pointer-events: none;
}

.ph-network-lines path {
    fill: none;

    stroke: url("#phLineGradient");
    stroke-width: 2.5;
    stroke-linecap: round;

    stroke-dasharray: 8 8;

    opacity: 0.9;

    filter: url("#phLineGlow");
}

/* 광고 채널 노드 */
.ph-channel-node {
    position: absolute;
    z-index: 3;

    display: flex;
    min-width: 112px;
    align-items: center;
    gap: 9px;

    padding: 10px 13px;

    border: 1px solid rgba(174, 126, 255, 0.34);
    border-radius: 13px;

    background:
        rgba(16, 18, 52, 0.92);

    box-shadow:
        0 12px 26px rgba(0, 0, 0, 0.27),
        0 0 18px rgba(142, 82, 255, 0.11);
}

.ph-channel-node span {
    display: grid;

    width: 32px;
    height: 32px;

    place-items: center;

    border-radius: 9px;

    background:
        linear-gradient(
            145deg,
            #b16dff,
            #6634d5
        );

    color: #ffffff;

    font-size: 14px;
    font-weight: 900;
}

.ph-channel-node strong {
    color: #f0e9ff;

    font-size: 12px;
    font-weight: 800;
}

.ph-node-youtube {
    top: 51px;
    left: 48px;
}

.ph-node-instagram {
    top: 36px;
    left: 50%;

    transform: translateX(-50%);
}

.ph-node-blog {
    top: 51px;
    right: 48px;
}

.ph-node-sns {
    bottom: 51px;
    left: 48px;
}

.ph-node-homepage {
    bottom: 36px;
    left: 50%;

    transform: translateX(-50%);
}

.ph-node-portal {
    right: 48px;
    bottom: 51px;
}

/* =========================================================
   중간 메시지
========================================================= */

.ph-message-row {
    display: grid;
    grid-template-columns:
        minmax(430px, 1.1fr)
        minmax(390px, 0.9fr);

    gap: 60px;
    align-items: end;

    margin-bottom: 47px;
}

.ph-message-copy span {
    display: block;

    margin-bottom: 12px;

    color: #c079ff;

    font-size: 11px;
    font-weight: 900;

    letter-spacing: 0.2em;
}

.ph-message-copy h3 {
    margin: 0;

    color: #ffffff;

    font-size: clamp(33px, 3vw, 47px);
    line-height: 1.3;
    font-weight: 900;

    letter-spacing: -0.045em;
    word-break: keep-all;
}

.ph-message-copy p {
    max-width: 690px;

    margin: 19px 0 0;

    color: #b9bdd2;

    font-size: 16px;
    line-height: 1.75;

    word-break: keep-all;
}

.ph-message-badges {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;

    justify-content: flex-end;
}

.ph-message-badges span {
    display: inline-flex;
    min-height: 38px;
    align-items: center;

    padding: 0 15px;

    border: 1px solid rgba(173, 103, 255, 0.38);
    border-radius: 999px;

    background:
        rgba(40, 24, 78, 0.64);

    color: #eadcff;

    font-size: 12px;
    font-weight: 750;
}

/* =========================================================
   5개 기능 카드
========================================================= */

.ph-card-grid {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));

    gap: 24px;
}

/* 첫째 줄: 3개 카드 */
.ph-card:nth-child(1),
.ph-card:nth-child(2),
.ph-card:nth-child(3) {
    grid-column: span 2;
}

/* 둘째 줄: 2개 카드 */
.ph-card:nth-child(4) {
    grid-column: 2 / span 2;
}

.ph-card:nth-child(5) {
    grid-column: 4 / span 2;
}

.ph-card {
    --ph-accent: #9766ff;
    --ph-accent-soft: rgba(151, 102, 255, 0.15);

    position: relative;

    display: flex;
    min-height: 435px;
    flex-direction: column;

    padding: 30px 29px 26px;

    border: 1px solid rgba(158, 106, 255, 0.29);
    border-radius: 23px;

    background:
        linear-gradient(
            180deg,
            rgba(28, 25, 70, 0.94),
            rgba(12, 17, 47, 0.97)
        );

    box-shadow:
        0 24px 55px rgba(0, 0, 0, 0.24),
        inset 0 1px 0 rgba(255, 255, 255, 0.045);

    overflow: hidden;

    transition:
        transform 0.25s ease,
        border-color 0.25s ease,
        box-shadow 0.25s ease;
}

.ph-card::before {
    content: "";
    position: absolute;
    top: 0;
    right: 25px;
    left: 25px;

    height: 2px;

    background:
        linear-gradient(
            90deg,
            transparent,
            var(--ph-accent),
            transparent
        );

    opacity: 0;

    transition: opacity 0.25s ease;
}

.ph-card:hover {
    transform: translateY(-7px);

    border-color: var(--ph-accent);

    box-shadow:
        0 31px 68px rgba(0, 0, 0, 0.31),
        0 0 28px var(--ph-accent-soft);
}

.ph-card:hover::before {
    opacity: 1;
}

/* 카드별 색상 */
.ph-card-portal {
    --ph-accent: #39a8ff;
    --ph-accent-soft: rgba(57, 168, 255, 0.15);
}

.ph-card-ai {
    --ph-accent: #986dff;
    --ph-accent-soft: rgba(152, 109, 255, 0.17);
}

.ph-card-sns {
    --ph-accent: #f05abf;
    --ph-accent-soft: rgba(240, 90, 191, 0.15);
}

.ph-card-blog {
    --ph-accent: #ff9a42;
    --ph-accent-soft: rgba(255, 154, 66, 0.15);
}

.ph-card-analysis {
    --ph-accent: #32d5a0;
    --ph-accent-soft: rgba(50, 213, 160, 0.15);
}

/* 카드 상단 */
.ph-card-head {
    display: flex;
    gap: 17px;
    align-items: center;

    padding-bottom: 20px;

    border-bottom: 1px solid rgba(174, 155, 215, 0.17);
}

.ph-card-icon {
    display: grid;
    flex: 0 0 64px;

    width: 64px;
    height: 64px;

    place-items: center;

    border: 1px solid var(--ph-accent);
    border-radius: 18px;

    background:
        linear-gradient(
            145deg,
            var(--ph-accent),
            rgba(44, 29, 108, 0.98)
        );

    color: #ffffff;

    font-size: 24px;
    font-weight: 950;

    box-shadow:
        0 11px 25px var(--ph-accent-soft),
        inset 0 1px 0 rgba(255, 255, 255, 0.22);
}

.ph-card-number {
    display: block;

    margin-bottom: 4px;

    color: var(--ph-accent);

    font-size: 11px;
    font-weight: 900;

    letter-spacing: 0.15em;
}

.ph-card h3 {
    margin: 0;

    color: #ffffff;

    font-size: 24px;
    line-height: 1.25;
    font-weight: 870;

    letter-spacing: -0.035em;
}

.ph-card-summary {
    margin: 20px 0 17px;

    color: #c8c9da;

    font-size: 14px;
    line-height: 1.7;

    word-break: keep-all;
}

.ph-feature-list {
    display: grid;
    gap: 9px;

    margin: 0;
    padding: 0;

    list-style: none;
}

.ph-feature-list li {
    position: relative;

    padding-left: 20px;

    color: #ebebf6;

    font-size: 13px;
    line-height: 1.45;
}

.ph-feature-list li::before {
    content: "✓";
    position: absolute;
    top: 0;
    left: 0;

    color: var(--ph-accent);

    font-weight: 900;
}

/* 실제 효과 문구 */
.ph-card-result {
    margin-top: 18px;
    padding-top: 16px;

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

    color: var(--ph-accent);

    font-size: 15px;
    line-height: 1.45;
    font-weight: 850;

    letter-spacing: -0.018em;
    word-break: keep-all;
}

/* =========================================================
   하단 CTA
========================================================= */

.ph-bottom-cta {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 30px;

    margin-top: 56px;
    padding: 34px 38px;

    border: 1px solid rgba(169, 104, 255, 0.34);
    border-radius: 23px;

    background:
        linear-gradient(
            100deg,
            rgba(56, 30, 115, 0.9),
            rgba(20, 19, 60, 0.95)
        );

    box-shadow:
        0 24px 55px rgba(0, 0, 0, 0.23),
        inset 0 1px 0 rgba(255, 255, 255, 0.055);
}

.ph-bottom-copy span {
    display: block;

    margin-bottom: 8px;

    color: #c177ff;

    font-size: 11px;
    font-weight: 900;

    letter-spacing: 0.2em;
}

.ph-bottom-copy strong {
    display: block;

    color: #ffffff;

    font-size: 25px;
    line-height: 1.45;
    font-weight: 840;

    letter-spacing: -0.03em;
}

.ph-bottom-cta a {
    display: inline-flex;
    flex: 0 0 auto;
    min-height: 52px;
    align-items: center;
    justify-content: center;
    gap: 10px;

    padding: 0 24px;

    border-radius: 11px;

    background:
        linear-gradient(
            135deg,
            #a360ff,
            #6333dc
        );

    color: #ffffff;

    font-size: 14px;
    font-weight: 850;

    box-shadow:
        0 14px 31px rgba(105, 50, 215, 0.32);

    transition:
        transform 0.22s ease,
        box-shadow 0.22s ease;
}

.ph-bottom-cta a:hover {
    transform: translateY(-3px);

    box-shadow:
        0 18px 39px rgba(116, 55, 226, 0.44);
}

/* =========================================================
   태블릿 반응형
========================================================= */

@media (max-width: 1120px) {
    .ph-heading-layout {
        grid-template-columns: 1fr;
        gap: 44px;
    }

    .ph-brand-area {
        max-width: 750px;
    }

    .ph-network {
        width: min(760px, 100%);
        margin: 0 auto;
    }

    .ph-message-row {
        grid-template-columns: 1fr;
        gap: 28px;
    }

    .ph-message-badges {
        justify-content: flex-start;
    }

    .ph-card-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .ph-card:nth-child(1),
    .ph-card:nth-child(2),
    .ph-card:nth-child(3),
    .ph-card:nth-child(4),
    .ph-card:nth-child(5) {
        grid-column: auto;
    }

    .ph-card:nth-child(5) {
        grid-column: 1 / -1;
        width: calc(50% - 12px);
        justify-self: center;
    }
}

/* =========================================================
   모바일 반응형
========================================================= */

@media (max-width: 720px) {
    .ph-section {
        padding: 82px 0;
    }

    .ph-brand-area h2 {
        font-size: 62px;
    }

    .ph-brand-area strong {
        font-size: 28px;
    }

    .ph-network {
        min-height: auto;

        padding: 28px 20px;

        overflow: visible;
    }

    .ph-network-center {
        position: relative;
        top: auto;
        left: auto;

        width: 164px;
        height: 164px;

        margin: 0 auto 30px;

        transform: none;
    }

    .ph-network-lines {
        display: none;
    }

    .ph-channel-node {
        position: relative;
        top: auto;
        right: auto;
        bottom: auto;
        left: auto;

        width: 100%;

        margin-top: 10px;

        transform: none;
    }

    .ph-message-copy h3 {
        font-size: 32px;
    }

    .ph-message-copy h3 br {
        display: none;
    }

    .ph-card-grid {
        grid-template-columns: 1fr;
    }

    .ph-card:nth-child(5) {
        grid-column: auto;
        width: 100%;
    }

    .ph-card {
        min-height: auto;
    }

    .ph-bottom-cta {
        align-items: flex-start;
        flex-direction: column;
    }

    .ph-bottom-cta a {
        width: 100%;
    }
}

/* =========================================================
   PropHub 우측 네트워크 설명 및 특징
   삽입 위치: estatehub-v2.css 가장 아래
========================================================= */

.ph-network-column {
    display: flex;
    min-width: 0;
    flex-direction: column;
    gap: 24px;
}

/* 네트워크 바로 아래 설명 */
.ph-network-info {
    padding: 0 8px;
}

.ph-network-description {
    margin: 0;

    color: #c5c8da;

    font-size: 16px;
    line-height: 1.75;

    word-break: keep-all;
}

/* RealtyHub 상단 배지와 같은 형식 */
.ph-network-badges {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;

    margin-top: 20px;
}

.ph-network-badges span {
    display: inline-flex;
    min-height: 38px;
    align-items: center;
    gap: 8px;

    padding: 0 15px;

    border: 1px solid rgba(176, 102, 255, 0.38);
    border-radius: 999px;

    background:
        rgba(42, 25, 84, 0.68);

    color: #eee2ff;

    font-size: 12px;
    line-height: 1.35;
    font-weight: 750;

    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.045);
}

.ph-network-badges span b {
    display: inline-grid;
    flex: 0 0 20px;

    width: 20px;
    height: 20px;

    place-items: center;

    border-radius: 50%;

    background:
        linear-gradient(
            145deg,
            #b66fff,
            #6539d9
        );

    color: #ffffff;

    font-size: 11px;
    font-weight: 900;

    box-shadow:
        0 6px 14px rgba(106, 54, 210, 0.3);
}

/* 기존 중간 메시지 영역이 남아 있어도 화면에 나타나지 않게 처리 */
.ph-message-row {
    display: none;
}

/* 태블릿 */
@media (max-width: 1120px) {
    .ph-network-column {
        width: min(760px, 100%);
        margin: 0 auto;
    }
}

/* 모바일 */
@media (max-width: 720px) {
    .ph-network-info {
        padding: 0;
    }

    .ph-network-description {
        font-size: 15px;
    }

    .ph-network-badges {
        flex-direction: column;
    }

    .ph-network-badges span {
        width: 100%;
        justify-content: flex-start;

        padding: 10px 14px;
    }
}

/* =========================================================
   RealtyHub 독립 페이지 배경 강제 적용
   삽입 위치: estatehub-v2.css 가장 아래
========================================================= */

/* 독립 RealtyHub 페이지 전체 배경 */
body.realtyhub-page {
    margin: 0;

    background: #061326;

    color: #ffffff;
}

/* RealtyHub 상세 섹션 배경
   기존 중복 CSS보다 우선 적용되도록 마지막에 배치 */
body.realtyhub-page .rh-section {
    position: relative;

    min-height: calc(100vh - 54px);

    background-color: #061326 !important;

    background-image:
        radial-gradient(
            circle at 8% 18%,
            rgba(21, 119, 255, 0.15),
            transparent 30%
        ),
        radial-gradient(
            circle at 92% 82%,
            rgba(35, 189, 255, 0.1),
            transparent 28%
        ),
        linear-gradient(
            180deg,
            #061326 0%,
            #07172c 100%
        ) !important;

    color: #ffffff;
}

/* 격자도 어두운 배경 위에서만 은은하게 표시 */
body.realtyhub-page .rh-section::before {
    background-image:
        linear-gradient(
            rgba(73, 132, 204, 0.06) 1px,
            transparent 1px
        ),
        linear-gradient(
            90deg,
            rgba(73, 132, 204, 0.06) 1px,
            transparent 1px
        );

    background-size: 52px 52px;
}

/* =========================================================
   RentalHub 독립 제품 페이지
   삽입 위치: estatehub-v2.css 가장 아래
========================================================= */

/* 독립 페이지 전체 배경 */
html,
body.rentalhub-page {
    margin: 0;
    min-height: 100%;

    background: #041b1b;
    color: #ffffff;
}

/* RentalHub 전체 섹션 */
body.rentalhub-page .rt-section {
    position: relative;
    overflow: hidden;

    min-height: calc(100vh - 54px);

    padding: 120px 0;

    background:
        radial-gradient(
            circle at 9% 18%,
            rgba(29, 202, 143, 0.14),
            transparent 30%
        ),
        radial-gradient(
            circle at 91% 76%,
            rgba(27, 166, 214, 0.09),
            transparent 28%
        ),
        linear-gradient(
            180deg,
            #041918 0%,
            #062321 50%,
            #041a1d 100%
        ) !important;

    color: #ffffff;
}

/* 배경 격자 */
body.rentalhub-page .rt-section::before {
    content: "";
    position: absolute;
    inset: 0;

    pointer-events: none;

    background-image:
        linear-gradient(
            rgba(70, 177, 152, 0.055) 1px,
            transparent 1px
        ),
        linear-gradient(
            90deg,
            rgba(70, 177, 152, 0.055) 1px,
            transparent 1px
        );

    background-size: 52px 52px;
}

.rt-section > .wrap {
    position: relative;
    z-index: 2;
}

/* =========================================================
   상단 소개 영역
========================================================= */

.rt-heading-layout {
    display: grid;
    grid-template-columns:
        minmax(390px, 0.88fr)
        minmax(540px, 1.12fr);

    gap: 76px;
    align-items: center;

    margin-bottom: 72px;
}

/* 왼쪽 브랜드 */
.rt-brand-area {
    padding: 15px 0 24px;
}

.rt-brand-label {
    display: inline-flex;
    align-items: center;
    gap: 12px;

    margin-bottom: 22px;

    color: #43dfae;

    font-size: 12px;
    font-weight: 900;
    font-style: italic;

    letter-spacing: 0.2em;
}

.rt-brand-label::before {
    content: "";

    width: 34px;
    height: 2px;

    border-radius: 999px;

    background:
        linear-gradient(
            90deg,
            #33d7a0,
            #47e5d6
        );

    box-shadow:
        0 0 12px rgba(55, 221, 174, 0.55);
}

.rt-brand-area h1 {
    margin: 0;

    color: #ffffff;

    font-size: clamp(68px, 7vw, 108px);
    line-height: 0.9;
    font-weight: 950;

    letter-spacing: -0.075em;

    text-shadow:
        0 0 34px rgba(38, 202, 146, 0.2);
}

.rt-brand-area h1 span {
    color: #34d796;
}

.rt-brand-area strong {
    display: block;

    margin-top: 31px;

    color: #ffffff;

    font-size: clamp(28px, 2.6vw, 40px);
    line-height: 1.36;
    font-weight: 900;

    letter-spacing: -0.048em;
    word-break: keep-all;
}

.rt-brand-area strong::before {
    content: "";

    display: block;

    width: 72px;
    height: 4px;

    margin-bottom: 24px;

    border-radius: 999px;

    background:
        linear-gradient(
            90deg,
            #28d699,
            #52e0d0
        );

    box-shadow:
        0 0 16px rgba(48, 216, 163, 0.5);
}

.rt-brand-area p {
    max-width: 570px;

    margin: 24px 0 0;

    color: #b8d0ca;

    font-size: 17px;
    line-height: 1.8;

    word-break: keep-all;
}

/* 오른쪽 카피 */
.rt-heading-copy {
    max-width: 720px;
}

.rt-heading-eyebrow {
    display: inline-flex;
    align-items: center;
    gap: 11px;

    margin-bottom: 18px;

    color: #45dfb2;

    font-size: 13px;
    font-weight: 850;

    letter-spacing: 0.1em;
}

.rt-heading-eyebrow::before {
    content: "";

    width: 32px;
    height: 2px;

    border-radius: 999px;

    background: #45dfb2;

    box-shadow:
        0 0 12px rgba(69, 223, 178, 0.48);
}

.rt-heading-copy h2 {
    margin: 0;

    color: #ffffff;

    font-size: clamp(34px, 3.3vw, 50px);
    line-height: 1.28;
    font-weight: 900;

    letter-spacing: -0.05em;
    word-break: keep-all;
}

.rt-heading-copy p {
    margin: 25px 0 0;

    color: #b6cbc7;

    font-size: 18px;
    line-height: 1.85;

    word-break: keep-all;
}

.rt-heading-badges {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;

    margin-top: 28px;
}

.rt-heading-badges span {
    display: inline-flex;
    min-height: 36px;
    align-items: center;

    padding: 0 15px;

    border: 1px solid rgba(52, 215, 155, 0.38);
    border-radius: 999px;

    background:
        rgba(8, 62, 53, 0.72);

    color: #d9fff1;

    font-size: 12px;
    font-weight: 750;
}

/* =========================================================
   6개 업무 카드
========================================================= */

.rt-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));

    gap: 25px;
}

.rt-card {
    --rt-accent: #36d89d;
    --rt-soft: rgba(54, 216, 157, 0.14);

    position: relative;

    display: flex;
    min-height: 410px;
    flex-direction: column;

    padding: 30px 29px 26px;

    border: 1px solid rgba(57, 205, 157, 0.29);
    border-radius: 23px;

    background:
        linear-gradient(
            180deg,
            rgba(10, 62, 58, 0.94),
            rgba(4, 38, 40, 0.97)
        );

    box-shadow:
        0 24px 55px rgba(0, 0, 0, 0.23),
        inset 0 1px 0 rgba(255, 255, 255, 0.045);

    transition:
        transform 0.25s ease,
        border-color 0.25s ease,
        box-shadow 0.25s ease;
}

.rt-card::before {
    content: "";

    position: absolute;
    top: 0;
    right: 27px;
    left: 27px;

    height: 2px;

    background:
        linear-gradient(
            90deg,
            transparent,
            var(--rt-accent),
            transparent
        );

    opacity: 0;

    transition: opacity 0.25s ease;
}

.rt-card:hover {
    transform: translateY(-7px);

    border-color: var(--rt-accent);

    box-shadow:
        0 30px 68px rgba(0, 0, 0, 0.3),
        0 0 28px var(--rt-soft);
}

.rt-card:hover::before {
    opacity: 1;
}

/* 카드별 포인트 색상 */
.rt-card-assets {
    --rt-accent: #36d89d;
}

.rt-card-contract {
    --rt-accent: #45cfd6;
}

.rt-card-billing {
    --rt-accent: #61d477;
}

.rt-card-arrears {
    --rt-accent: #ffb94d;
    --rt-soft: rgba(255, 185, 77, 0.14);
}

.rt-card-maintenance {
    --rt-accent: #43b9e6;
    --rt-soft: rgba(67, 185, 230, 0.14);
}

.rt-card-report {
    --rt-accent: #69d9b2;
}

/* 카드 상단 */
.rt-card-top {
    display: flex;
    gap: 17px;
    align-items: center;

    padding-bottom: 20px;

    border-bottom:
        1px solid rgba(138, 209, 192, 0.17);
}

.rt-icon {
    display: grid;
    flex: 0 0 64px;

    width: 64px;
    height: 64px;

    place-items: center;

    border: 1px solid var(--rt-accent);
    border-radius: 18px;

    background:
        linear-gradient(
            145deg,
            var(--rt-accent),
            rgba(4, 86, 67, 0.98)
        );

    color: #ffffff;

    font-size: 26px;
    font-weight: 950;

    box-shadow:
        0 11px 25px var(--rt-soft),
        inset 0 1px 0 rgba(255, 255, 255, 0.22);
}

.rt-card-number {
    display: block;

    margin-bottom: 4px;

    color: var(--rt-accent);

    font-size: 11px;
    font-weight: 900;

    letter-spacing: 0.15em;
}

.rt-card h3 {
    margin: 0;

    color: #ffffff;

    font-size: 24px;
    line-height: 1.25;
    font-weight: 870;

    letter-spacing: -0.035em;
}

/* 카드 본문 */
.rt-card-summary {
    margin: 20px 0 17px;

    color: #c6d9d5;

    font-size: 14px;
    line-height: 1.7;

    word-break: keep-all;
}

.rt-feature-list {
    display: grid;
    gap: 9px;

    margin: 0;
    padding: 0;

    list-style: none;
}

.rt-feature-list li {
    position: relative;

    padding-left: 20px;

    color: #e5f2ef;

    font-size: 13px;
    line-height: 1.45;
}

.rt-feature-list li::before {
    content: "✓";

    position: absolute;
    top: 0;
    left: 0;

    color: var(--rt-accent);

    font-weight: 900;
}

/* 카드 하단 실제 효과 */
.rt-card-result {
    margin-top: 18px;
    padding-top: 16px;

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

    color: var(--rt-accent);

    font-size: 15px;
    line-height: 1.45;
    font-weight: 850;

    letter-spacing: -0.018em;
    word-break: keep-all;
}

/* =========================================================
   하단 CTA
========================================================= */

.rt-bottom-cta {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 30px;

    margin-top: 56px;
    padding: 34px 38px;

    border: 1px solid rgba(52, 215, 155, 0.34);
    border-radius: 23px;

    background:
        linear-gradient(
            100deg,
            rgba(9, 78, 65, 0.9),
            rgba(4, 42, 45, 0.96)
        );

    box-shadow:
        0 24px 55px rgba(0, 0, 0, 0.23),
        inset 0 1px 0 rgba(255, 255, 255, 0.055);
}

.rt-bottom-copy span {
    display: block;

    margin-bottom: 8px;

    color: #49dcae;

    font-size: 11px;
    font-weight: 900;

    letter-spacing: 0.2em;
}

.rt-bottom-copy strong {
    display: block;

    color: #ffffff;

    font-size: 25px;
    line-height: 1.45;
    font-weight: 840;

    letter-spacing: -0.03em;
}

.rt-bottom-cta a {
    display: inline-flex;
    flex: 0 0 auto;
    min-height: 52px;
    align-items: center;
    justify-content: center;
    gap: 10px;

    padding: 0 24px;

    border-radius: 11px;

    background:
        linear-gradient(
            135deg,
            #35d998,
            #078c65
        );

    color: #ffffff;

    font-size: 14px;
    font-weight: 850;

    box-shadow:
        0 14px 31px rgba(11, 154, 103, 0.3);

    transition:
        transform 0.22s ease,
        box-shadow 0.22s ease;
}

.rt-bottom-cta a:hover {
    transform: translateY(-3px);

    box-shadow:
        0 18px 39px rgba(11, 170, 111, 0.42);
}

/* =========================================================
   태블릿
========================================================= */

@media (max-width: 1100px) {
    .rt-heading-layout {
        grid-template-columns: 1fr;
        gap: 40px;
    }

    .rt-brand-area,
    .rt-heading-copy {
        max-width: 750px;
    }

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

/* =========================================================
   모바일
========================================================= */

@media (max-width: 720px) {
    body.rentalhub-page .rt-section {
        padding: 82px 0;
    }

    .rt-brand-area h1 {
        font-size: 59px;
    }

    .rt-brand-area strong {
        font-size: 27px;
    }

    .rt-heading-copy h2 {
        font-size: 32px;
    }

    .rt-heading-copy h2 br {
        display: none;
    }

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

    .rt-card {
        min-height: auto;
    }

    .rt-bottom-cta {
        align-items: flex-start;
        flex-direction: column;
    }

    .rt-bottom-cta a {
        width: 100%;
    }
}

/* =========================================================
   EstateHub Home - 효과 중심 제품 소개
   Home 전용 선택자만 사용하여 상세페이지 CSS와 충돌하지 않습니다.
========================================================= */
body.estatehub-home-page {
    margin: 0;
    background: #06101f;
    color: #ffffff;
}

.home-products {
    background: #06101f;
}

.home-product {
    --home-accent: #4a9cff;
    --home-accent-soft: rgba(74, 156, 255, .15);
    position: relative;
    overflow: hidden;
    padding: 108px 0 96px;
    color: #ffffff;
}

.home-product::before {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
    background-image:
        linear-gradient(rgba(91, 139, 205, .045) 1px, transparent 1px),
        linear-gradient(90deg, rgba(91, 139, 205, .045) 1px, transparent 1px);
    background-size: 52px 52px;
}

.home-product--realty {
    --home-accent: #45a9ff;
    --home-accent-soft: rgba(52, 153, 255, .16);
    background:
        radial-gradient(circle at 9% 18%, rgba(27, 119, 255, .15), transparent 30%),
        radial-gradient(circle at 92% 84%, rgba(45, 196, 255, .08), transparent 28%),
        linear-gradient(180deg, #061326, #071a31);
}

.home-product--prop {
    --home-accent: #ae76ff;
    --home-accent-soft: rgba(174, 118, 255, .17);
    background:
        radial-gradient(circle at 88% 18%, rgba(174, 82, 255, .17), transparent 31%),
        radial-gradient(circle at 10% 82%, rgba(229, 76, 255, .09), transparent 27%),
        linear-gradient(180deg, #090c22, #10122f);
}

.home-product--rental {
    --home-accent: #43dda2;
    --home-accent-soft: rgba(67, 221, 162, .15);
    background:
        radial-gradient(circle at 9% 20%, rgba(35, 202, 145, .15), transparent 30%),
        radial-gradient(circle at 91% 80%, rgba(40, 185, 218, .08), transparent 28%),
        linear-gradient(180deg, #041918, #062421);
}

.home-product > .wrap,
.home-product .wrap {
    position: relative;
    z-index: 2;
}

.home-product__layout {
    display: grid;
    grid-template-columns: minmax(360px, .82fr) minmax(560px, 1.18fr);
    gap: 78px;
    align-items: center;
}

.home-product__layout--reverse .home-product__brand {
    order: 2;
}

.home-product__layout--reverse .home-product__content {
    order: 1;
}

.home-product__brand {
    padding: 12px 0 20px;
}

.home-product__eyebrow {
    display: inline-flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 22px;
    color: var(--home-accent);
    font-size: 12px;
    font-weight: 900;
    font-style: italic;
    letter-spacing: .2em;
}

.home-product__eyebrow::before {
    content: "";
    width: 34px;
    height: 2px;
    border-radius: 999px;
    background: var(--home-accent);
    box-shadow: 0 0 12px var(--home-accent);
}

.home-product__brand h2 {
    margin: 0;
    color: #ffffff;
    font-size: clamp(66px, 6.6vw, 104px);
    line-height: .9;
    font-weight: 950;
    letter-spacing: -.075em;
    text-shadow: 0 0 34px var(--home-accent-soft);
}

.home-product__brand h2 span {
    color: var(--home-accent);
}

.home-product__slogan {
    margin: 31px 0 0;
    color: #ffffff;
    font-size: clamp(27px, 2.45vw, 38px);
    line-height: 1.38;
    font-weight: 900;
    letter-spacing: -.045em;
    word-break: keep-all;
}

.home-product__slogan::before {
    content: "";
    display: block;
    width: 72px;
    height: 4px;
    margin-bottom: 24px;
    border-radius: 999px;
    background: var(--home-accent);
    box-shadow: 0 0 16px var(--home-accent-soft);
}

.home-product__content {
    max-width: 720px;
}

.home-product__label {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 17px;
    color: var(--home-accent);
    font-size: 13px;
    font-weight: 850;
    letter-spacing: .08em;
}

.home-product__label::before {
    content: "";
    width: 30px;
    height: 2px;
    background: var(--home-accent);
    border-radius: 999px;
}

.home-product__content h3 {
    margin: 0;
    color: #ffffff;
    font-size: clamp(34px, 3.15vw, 49px);
    line-height: 1.28;
    font-weight: 900;
    letter-spacing: -.05em;
    word-break: keep-all;
}

.home-product__content > p {
    margin: 24px 0 0;
    color: #bbc9da;
    font-size: 17px;
    line-height: 1.82;
    word-break: keep-all;
}

.home-outcomes {
    display: grid;
    gap: 12px;
    margin-top: 29px;
}

.home-outcomes > div {
    position: relative;
    min-height: 84px;
    padding: 17px 20px 16px 65px;
    border: 1px solid color-mix(in srgb, var(--home-accent) 34%, transparent);
    border-radius: 17px;
    background: rgba(255, 255, 255, .045);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .04);
    transition: transform .22s ease, border-color .22s ease, background .22s ease;
}

.home-outcomes > div:hover {
    transform: translateX(6px);
    border-color: var(--home-accent);
    background: rgba(255, 255, 255, .065);
}

.home-outcomes b {
    position: absolute;
    top: 18px;
    left: 20px;
    color: var(--home-accent);
    font-size: 12px;
    font-weight: 900;
    letter-spacing: .1em;
}

.home-outcomes strong {
    display: block;
    color: #ffffff;
    font-size: 16px;
    line-height: 1.35;
}

.home-outcomes span {
    display: block;
    margin-top: 5px;
    color: #aebed1;
    font-size: 12px;
    line-height: 1.5;
}

.home-product-cta {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 30px;
    margin-top: 54px;
    padding: 32px 37px;
    border: 1px solid color-mix(in srgb, var(--home-accent) 38%, transparent);
    border-radius: 23px;
    background: rgba(255, 255, 255, .055);
    box-shadow: 0 24px 55px rgba(0, 0, 0, .2), inset 0 1px 0 rgba(255, 255, 255, .05);
}

.home-product-cta span {
    display: block;
    margin-bottom: 8px;
    color: var(--home-accent);
    font-size: 11px;
    font-weight: 900;
    letter-spacing: .2em;
}

.home-product-cta strong {
    display: block;
    color: #ffffff;
    font-size: 24px;
    line-height: 1.45;
    font-weight: 840;
    letter-spacing: -.03em;
}

.home-product-cta a {
    display: inline-flex;
    flex: 0 0 auto;
    min-height: 52px;
    align-items: center;
    justify-content: center;
    gap: 10px;
    padding: 0 24px;
    border-radius: 11px;
    background: var(--home-accent);
    color: #ffffff;
    font-size: 14px;
    font-weight: 850;
    box-shadow: 0 14px 31px var(--home-accent-soft);
    transition: transform .22s ease, box-shadow .22s ease;
}

.home-product-cta a:hover {
    transform: translateY(-3px);
    box-shadow: 0 18px 39px var(--home-accent-soft);
}

.home-final-cta {
    position: relative;
    overflow: hidden;
    padding: 92px 0;
    color: #ffffff;
    background:
        radial-gradient(circle at 15% 25%, rgba(44, 120, 255, .24), transparent 30%),
        radial-gradient(circle at 86% 72%, rgba(55, 218, 190, .15), transparent 28%),
        linear-gradient(135deg, #030b19, #0a1d3c);
}

.home-final-cta__inner {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 54px;
    padding: 48px 50px;
    border: 1px solid rgba(93, 157, 247, .32);
    border-radius: 28px;
    background: rgba(5, 24, 52, .72);
    box-shadow: 0 28px 70px rgba(0, 0, 0, .28), inset 0 1px 0 rgba(255, 255, 255, .06);
}

.home-final-cta__inner span {
    color: #56dce8;
    font-size: 11px;
    font-weight: 900;
    letter-spacing: .2em;
}

.home-final-cta__inner h2 {
    margin: 13px 0 14px;
    color: #ffffff;
    font-size: clamp(34px, 3.5vw, 53px);
    line-height: 1.2;
    font-weight: 950;
    letter-spacing: -.05em;
}

.home-final-cta__inner p {
    max-width: 700px;
    margin: 0;
    color: #b9c8db;
    font-size: 16px;
    line-height: 1.75;
}

.home-final-cta__actions {
    display: flex;
    flex: 0 0 auto;
    flex-direction: column;
    gap: 12px;
    min-width: 230px;
}

.home-final-cta__actions a {
    display: inline-flex;
    min-height: 52px;
    align-items: center;
    justify-content: center;
    gap: 9px;
    padding: 0 22px;
    border-radius: 11px;
    font-size: 14px;
    font-weight: 850;
}

.home-final-cta__primary {
    background: linear-gradient(135deg, #1888ff, #075be0);
    color: #ffffff;
    box-shadow: 0 15px 32px rgba(9, 96, 226, .3);
}

.home-final-cta__secondary {
    border: 1px solid rgba(112, 170, 248, .42);
    background: rgba(5, 20, 44, .52);
    color: #dbeaff;
}

/* Home Hero 상단 공간을 안정적으로 축소 */
body.estatehub-home-page .eh-hero {
    padding-top: 16px;
}

@media (max-width: 1100px) {
    .home-product__layout,
    .home-product__layout--reverse {
        grid-template-columns: 1fr;
        gap: 38px;
    }

    .home-product__layout--reverse .home-product__brand,
    .home-product__layout--reverse .home-product__content {
        order: initial;
    }

    .home-product__brand,
    .home-product__content {
        max-width: 780px;
    }

    .home-final-cta__inner {
        align-items: flex-start;
        flex-direction: column;
    }

    .home-final-cta__actions {
        width: 100%;
        min-width: 0;
        flex-direction: row;
    }

    .home-final-cta__actions a {
        flex: 1;
    }
}

@media (max-width: 720px) {
    .home-product {
        padding: 78px 0 70px;
    }

    .home-product__brand h2 {
        font-size: 58px;
    }

    .home-product__slogan {
        font-size: 26px;
    }

    .home-product__content h3 {
        font-size: 32px;
    }

    .home-product__content h3 br,
    .home-product__slogan br,
    .home-product-cta strong br,
    .home-final-cta__inner h2 br {
        display: none;
    }

    .home-product-cta {
        align-items: flex-start;
        flex-direction: column;
        margin-top: 38px;
        padding: 27px 23px;
    }

    .home-product-cta a {
        width: 100%;
    }

    .home-final-cta {
        padding: 70px 0;
    }

    .home-final-cta__inner {
        padding: 32px 24px;
    }

    .home-final-cta__actions {
        flex-direction: column;
    }

    body.estatehub-home-page .eh-hero {
        padding-top: 34px;
    }
}

/* Unified SoftFlo public navigation */
.brand--logo {
    display: flex;
    align-items: center;
}

.brand--logo img {
    display: block;
    width: 154px;
    height: auto;
    transform: translateY(3px);
}

.topnav .wrap {
    gap: 26px;
}

.navlinks {
    gap: 24px;
    font-size: 13px;
    font-weight: 800;
}

.navactions {
    display: flex;
    align-items: center;
    gap: 10px;
}

.navsecondary,
.navcta {
    display: inline-flex;
    min-height: 42px;
    align-items: center;
    justify-content: center;
    padding: 0 16px;
    border-radius: 10px;
    font-size: 12px;
    font-weight: 850;
}

.navsecondary {
    border: 1px solid rgba(91, 160, 255, 0.32);
    background: rgba(25, 83, 156, 0.24);
    color: #dcecff;
}

.navcta {
    background: #1468f2;
    color: #fff;
}

@media (max-width: 1180px) {
    .topnav .navlinks {
        gap: 16px;
        font-size: 12px;
    }

    .brand--logo img {
        width: 140px;
    }
}

@media (max-width: 980px) {
    .topnav .navlinks {
        display: none;
    }

    .topnav .wrap {
        height: 68px;
    }

    .navsecondary {
        display: none;
    }

    .brand--logo img {
        width: 132px;
    }
}